@charset "utf-8";
/* CSS Document */
/*↓初期設定的な↓*/
* {
padding: 0;
margin: 0;
font-size: 100%;
font-style: normal;

}
section, article, aside, header, footer, nav, figure, main {
display: block;
}
li img {
/*display: block;*/
}
li {
list-style-type: none;
}
a img {
border: none;
}
body {
width: 100%;
height: 100%;
}
html {
height: 100%;
}
/*↑初期設定的な↑*/
.pc {
display: none
}
/*@font-face {
font-family: mplusM;
font-display: swap;
src: url(../fonts/unhinted-mplus-1p-medium.woff2) format('woff2'), url(../fonts/unhinted-mplus-1p-medium.ttf) format('truetype')
}
@font-face {
font-family: mplusB;
font-display: swap;
src: url(../fonts/unhinted-mplus-1p-heavy.woff2) format('woff2'), url(../fonts/unhinted-mplus-1p-heavy.ttf) format('truetype')
}
@font-face {
font-family: mplusL;
font-display: swap;
src: url(../fonts/unhinted-mplus-1p-light.woff2) format('woff2'), url(../fonts/unhinted-mplus-1p-light.ttf) format('truetype')
}
*/.mt20 {
margin-top: 20px
}
[class^=cmn-].width-full {
max-width: 100%
}
.cmn-container {
/*font-family: 'Noto Serif JP','游ゴシック体',YuGothic,'游ゴシック','Yu Gothic','ヒラギノ角ゴ ProN W3',Hiragino Kaku Gothic ProN,Arial,'メイリオ',Meiryo,sans-serif;*/
	font-family: "Noto Sans JP";
font-weight: 100;
line-height: 1.8;
padding-bottom: 50px;
color: #353535
}
.cmn-container.padding-top {
padding-top: 30px
}
.cmn-container.bg-gray {
background: #f1f1f1
}
.cmn-container.bg-white {
background: #fff
}
.cmn-container h1, .cmn-container h2, .cmn-container h3, .cmn-container h4, .cmn-container h5, .cmn-container h6 {
	/*font-family: 'Noto Serif JP','游ゴシック体',YuGothic,'游ゴシック','Yu Gothic','ヒラギノ角ゴ ProN W3',Hiragino Kaku Gothic ProN,Arial,'メイリオ',Meiryo,sans-serif;*//*
font-family: din-2014, -apple-system, BlinkMacSystemFont, 'Helvetica Neue', '游ゴシック Medium', 'Yu Gothic Medium', '游ゴシック体', YuGothic, 'ヒラギノ角ゴ ProN W3', Hiragino Kaku Gothic ProN, Arial, 'メイリオ', Meiryo, sans-serif;*/
	font-family: 'Abril Fatface', cursive;
padding: 0
}
.cmn-container .inner {
box-sizing: content-box;
max-width: 1080px;
margin: 0 auto;
padding: 0 10px
}
.cmn-container a {
border-bottom: 1px solid #353535
}
.cmn-container a:hover {
text-decoration: none
}
.cmn-container .PC {
display: none !important
}
.cmn-container .SP {
display: block !important
}
.cmn-container img {
width: 100%;
height: auto;
vertical-align: bottom
}
.cmn-visual {
width: 100%;
margin: 0 auto 25px
}
section.style_block {
    margin: 60px auto 0;
}

.cmn-area-hdg-lead {
/*margin-bottom: 50px
*/}
.cmn-area-hdg-lead p {
/*    margin-bottom: 50px;
*/}
.cmn-area-hdg-lead time {
font-size: 12px
}
.cmn-area-hdg-prof {
margin-bottom: 50px
}
.cmn-area-hdg-prof p {
margin-bottom: 20px
}
.cmn-area-hdg-prof time {
font-size: 12px
}
.cmn-hdg-lv1 {
	background-color: transparent;
}
.cmn-hdg-lv1 .small {
font-size: .8em
}
.cmn-hdg-lv1-sub {
margin: 0 0 5px;
display: block;
font-size: 20px
}
.cmn-line {
text-align: center;
font-size: 1.4rem;
margin: 2rem auto;
}

/*.cmn-hdg-lv2 {
font-size: 20px;
font-weight: 700;
line-height: 1.3;
margin-bottom: 10px
}*/
.cmn-hdg-lv2 {
    font-weight: 700;
    line-height: 1.3;
    width: 100%;
    max-width: 500px;
    background-color: transparent;
    text-align: center;
    margin: 40px 0 10px;
}

	.creater-name {
    font-size: 25px;
    margin-bottom: 3px;

	
}
.creater-category {
    font-size: 14px;
    font-weight: 500;
}
.cmn-hdg-lv3 {
font-size: 16px;
font-weight: 700;
line-height: 1.3;
margin-bottom: 10px
}
.cmn-lead {
    line-height: 1.8;
    text-align: center;
    font-family: 'Noto Serif JP','游ゴシック体',YuGothic,'游ゴシック','Yu Gothic','ヒラギノ角ゴ ProN W3',Hiragino Kaku Gothic ProN,Arial,'メイリオ',Meiryo,sans-serif;
    position: relative;
    font-size: 14px;
    /* padding-top: 15px; */
}
/*.cmn-lead:before {
	content: '';
    width: 20px;
    height: 1px;
    background: #000;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
}
*/.cmn-lead-1 {
line-height: 1.8
}
.cmn-lead-2 {
    line-height: 2;


}
.cmn-lead-3 {
    text-align: center;
    margin: 2px 0 7px !important;
    font-family: 'Abril Fatface', cursive;
    font-size: 15px;
}


.cmn-lead:last-child {
    margin-bottom: 10px;
    font-weight: bold;
}

.no-slider {
    padding: 0 20%;
    margin-bottom: 20px;
}

.cmn-card {
margin-bottom: 50px;
padding: 20px;
background: #fff
}
.cmn-card .card-ttl {
font-size: 18px;
font-weight: 700
}
.cmn-card .card-ttl span {
font-size: .8em;
padding-right: 10px
}
.cmn-card .card-content {
margin-top: 10px
}
.cmn-card .card-content p {
margin-bottom: 20px
}
.cmn-card .card-content p:last-child {
margin-bottom: 0
}
.cmn-fig-credit {
margin-bottom: 70px;
padding: 0 20px;
}
.cmn-fig-credit:last-child {
margin-bottom: 0
}
.cmn-figure {
max-width: 600px;
margin: 0 auto 15px
}
.cmn-figure.figure-small {
padding: 0 50px
}
.cmn-figure.split-2 {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
align-items: flex-start
}
.cmn-figure.split-2 img {
width: 49.5%
}
.cmn-figure.split-3 {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
align-items: flex-start
}
.cmn-figure.split-3 img {
width: 32.5%
}
.cmn-figure.split-4 {
display: -webkit-box;
display: flex;
-webkit-box-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
align-items: flex-start
}
.cmn-figure.split-4 img {
width: 24.5%
}
.cmn-credit {
    margin: 2px auto 35px;
}
.coatitemlist{
        width: 55%;
    margin: 0 auto;
}


.cmn-credit.credit-figure ul {
display: -webkit-box;
display: flex;
margin: 0 -10px;
flex-wrap: wrap
}
.cmn-credit.credit-figure ul li {
width: 25%;
margin-bottom: 20px;
padding: 0 10px
}
.cmn-credit.credit-figure ul li a {
display: block;
border-bottom: none
}
.cmn-credit.credit-figure ul li img {
width: 100%
}
.cmn-credit li {
    color: #676767;
    font-size: 12px;
    text-align: center;
    margin-bottom: 5px;
    /* font-family: 'Abril Fatface', cursive; */
}
.cmn-credit li a {
/*  color: #353535
*/}
.profile{
color: #424242;
}
.cmn-credit li:last-child {
margin-bottom: 0
}
.js-fade {
-webkit-transition: all ease 1s;
transition: all ease 1s;
-webkit-transform: translateY(30px);
transform: translateY(30px);
opacity: 0
}
.js-fade.fade-in {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
line-height: 1.8;
}
.cmn-recommend-owner-list {
position: relative;
}
.cmn-recommend-owner-list ul {
display: -webkit-box;
display: flex;
flex-wrap: wrap
}
.cmn-recommend-owner-list ul li {
/*  margin: 0 20px 10px 0
*/}
.cmn-recommend-owner-list ul li a {
font-weight: 700;
border-bottom: none
}
.cmn-recommend-owner-list ul li a::before {
}
.cmn-recommend-item {
margin-bottom: 33px
}
.cmn-recommend-item .cmn-hdg-lv2 {
margin-bottom: 0
}
.cmn-recommend-item .lead {
margin-bottom: 20px
}
.cmn-recommend-item .description {
line-height: 2
}
.cmn-recommend-item .price {
font-size: 1.2em;
margin: 20px 0;
text-align: left
}
.cmn-recommend-item .price::before {
content: '\0a5'
}
.cmn-recommend-item .cmn-credit {
margin-bottom: 20px
}
.cmn-recommend-item .image {
margin-bottom: 50px
}
.cmn-recommend-item dl {
margin-top: 10px
}
.cmn-recommend-item .cmn-btn {
margin-top: 0
}
.cmn-recommend-item .slick-next {
right: 0
}
.cmn-recommend-item .slick-prev {
left: 0
}
.cmn-item-counter + .cmn-recommend-owner {
margin-top: 0;
border-top: 0
}
.cmn-recommend-owner {
padding-top: 25px;
/* border-top: 1px solid #ddd; */
max-width: 330px;
width: 100%;
margin: 0 auto;
}
.cmn-recommend-owner .avatar {
width: 160px;
height: 160px;
margin: 0 auto 10px
}
.cmn-recommend-owner .avatar img {
width: 150px;
height: 150px;
border-radius: 3px;
-o-object-fit: cover;
object-fit: cover;
}
.cmn-recommend-owner .owner-profile {
margin-bottom: 10px
}
.cmn-recommend-owner .owner-profile .name {
font-size: 18px;
font-weight: 700;
text-align: center
}
.cmn-recommend-owner .owner-profile .lead {
font-weight: 700;
margin-bottom: 3px
}
.cmn-recommend-owner .item ul {
display: -webkit-box;
display: flex;
margin: 0 -2px
}
.cmn-recommend-owner .item ul li {
box-sizing: border-box;
width: 25%;
padding: 0 2px
}
.cmn-recommend-owner .item ul li a {
display: block;
border: 1px solid #ccc
}
.cmn-item-counter {
position: fixed;
top: 50%;
right: -50px;
display: -webkit-box;
display: flex;
width: 20px;
-webkit-transition: right ease .3s;
transition: right ease .3s;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
flex-flow: column;
-webkit-box-align: center;
align-items: center
}
.cmn-item-counter.slide-in {
right: 0
}
.cmn-item-counter .js-item-current::after {
display: block;
width: 100%;
height: 1px;
content: '';
background: #353535
}
.cmn-area-item .cmn-figure {
margin-bottom: 0
}
.cmn-area-item .cmn-figure.split-2 img {
width: 50%
}
.cmn-area-item .cmn-figure.split-3 img {
width: 33.3333333%
}
.cmn-area-item .cmn-figure.split-4 img {
width: 25%
}

 .staff {
    text-align: center;
    line-height: 1.8;
    margin-top: 80px;
}

/*    json回遊エリア	  */
.cmn-item-lists {
margin: 50px auto 0;
display: flex;
display: flex;
flex-flow: wrap;
width: 100%;
/* box-sizing: border-box; */
justify-content: space-around;
/* justify-content: center; */
justify-content: space-evenly;
}
.cmn-item-lists .item {
/* position: relative; */
/* box-sizing: border-box; */
/* margin: 10px 10px 20px 10px; */
border: 1px solid #ddd;
/* border-bottom: 1px solid #ddd; */
/* display: inline; */
width: 46%;
/* text-align: center; */
/* margin: 0 auto; */
/* max-width: 250px; */
/* padding: 5px; */
margin-bottom: 2%;
/* box-sizing: border-box; */
}
.cmn-item-lists .item::after, .cmn-item-lists .item::before {
position: absolute;
top: -5px;
width: 1px;
height: calc(100%+ 10px);
content: '';
background-color: #ddd
}
.cmn-item-lists .item::before {
left: 5px
}
.cmn-item-lists .item::after {
right: 5px
}
/*.cmn-item-lists .item a {
display: -webkit-box;
display: flex;
padding: 5px 10px 10px;
-webkit-transition-duration: .5s;
transition-duration: .5s;
border-bottom: none;
-webkit-box-align: center;
align-items: center
}*/
.cmn-item-lists .item a:hover {
opacity: .5
}
.cmn-item-lists .item figure {
/* width: 100px; */
padding: 7px;
}
.cmn-item-lists .item ul {
/* padding-left: 10px; */
margin: 0 auto;
/* text-align: center; */
/* width: 100%; */
/* max-width: 300px; */
padding: 7px;
}
.cmn-item-lists .item .category {
font-size: 10px;
margin-bottom: 5px
}
.cmn-item-lists .item .name {
font-size: 15px;
/*	font-weight: 700;*/
line-height: 1.3
}
.cmn-item-lists .item .price {
font-size: 12px;
margin-top: 5px;
text-align: left
}
.cmn-item-lists .item .price .unit {
font-size: .8em
}
.cmn-item-lists a {
border-bottom: none;
}
.cmn-news-content p {
margin-bottom: 20px
}
.cmn-news-content dl dt {
font-weight: 700
}
.cmn-news-content dl dd {
margin-bottom: 10px
}
.cmn-btn {
margin: 40px 0 55px;
text-align: center
}

.cmn-btn-ivo,.cmn-btn-gry, .cmn-btn-ppl,.cmn-btn-brn,.cmn-btn-pnk{
margin: 0 0 45px;
text-align: center
}
.cmn-btn-ivo a {
display: -webkit-inline-box;
display: inline-flex;
height: 1.5cm;
padding: 0 18px;
letter-spacing: .1em;
color: #fff;
border: 2px solid #aaa47b;
background: #aaa47b;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
max-width: 260px;
width: 100%;
}
.cmn-btn-gry a {
    display: -webkit-inline-box;
    display: inline-flex;
    height: 1.5cm;
    padding: 0px 18px;
    letter-spacing: .1em;
    color: #2d2d2d;
    border: 1px solid #2d2d2d;
    background: #ffffff;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    max-width: 285px;
    width: 100%;
}
.cmn-btn-ppl a {
display: -webkit-inline-box;
display: inline-flex;
height: 1.5cm;
padding: 0 18px;
letter-spacing: .1em;
color: #fff;
border: 2px solid #8881a2;
background: #8881a2;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
max-width: 285px;
width: 100%;
}
.cmn-btn-brn a {
display: -webkit-inline-box;
display: inline-flex;
height: 1.5cm;
padding: 0 18px;
letter-spacing: .1em;
color: #fff;
border: 2px solid #8c756b;
background: #8c756b;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
max-width: 285px;
width: 100%;
}
.cmn-btn-pnk a {
display: -webkit-inline-box;
display: inline-flex;
height: 1.5cm;
padding: 0 18px;
letter-spacing: .1em;
color: #fff;
border: 2px solid #b47f8c;
background: #b47f8c;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
max-width: 285px;
width: 100%;
}
/*.cmn-btn a {
display: -webkit-inline-box;
display: inline-flex;
height: 1.5cm;
padding: 0 45px;
letter-spacing: .1em;
color: #fff;
border: 2px solid #222;
background: #222;
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center;
max-width: 330px;
width: 100%;
}*/
.cmn-btn a:hover {
color: #353535;
background: #fff
}
.cmn-btn-ivo a:hover {
color: #aaa47b;
background: #fff
}
.cmn-btn-gry a:hover {
color: #fff;
background: #2d2d2d
}
.cmn-btn-ppl a:hover {
color: #8881a2;
background: #fff
}
.cmn-btn-brn a:hover {
color: #8c756b;
background: #fff
}
.cmn-btn-pnk a:hover {
color: #b47f8c;
background: #fff
}

.cmn-btn-ivo,.cmn-btn-gry, .cmn-btn-ppl,.cmn-btn-brn,.cmn-btn-pnk{
/*margin: 55px 0 60px;
*/	text-align: center;
}


.cmn-recommend-owner-list {
/*    margin-bottom: 100px;
*/}
.cmn-recommend-owner-list ul {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
max-width: 1050px;
margin: auto;
/* color: #fff; */
width: 100%;
justify-content: space-around;
}


.cmn-recommend-owner-list ul li {
width: 33%;
}
.cmn-area-look {
background: #f5f5f5;
}
.cmn-area-look .slide {
position: relative;
box-sizing: border-box;
width: 100vw;
height: calc(100vh - 150px);
padding: 20px;
opacity: 0
}
.cmn-area-look .slide.slick-current {
opacity: 1
}
.cmn-area-look .slide figure {
position: relative;
width: 100%;
height: 100%
}
.cmn-area-look .slide figure img {
position: absolute;
top: 50%;
left: 50%;
width: auto;
/*  max-width: 95%;
*/  height: auto;
max-height: 100%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%)
}
.cmn-area-look .slide .txt a {
color: #fff
}
.cmn-area-look .look-slider-thumbnail {
max-width: 600px;
margin: 30px auto 0;
margin-top: 30px;
padding-bottom: 25px
}
.cmn-area-look .look-slider-thumbnail .slide-thumbnail {
-webkit-filter: grayscale(100);
filter: grayscale(100)
}
.cmn-area-look .look-slider-thumbnail .slide-thumbnail.slick-current {
-webkit-filter: grayscale(0);
filter: grayscale(0)
}
.cmn-area-look .slide-counter {
font-size: 12px;
position: absolute;
bottom: 45px;
left: 20px
}
.cmn-q-and-a {
margin-bottom: 30px
}
.cmn-q-and-a .question {
font-size: 15px;
font-weight: 700;
margin-bottom: 10px
}
.cmn-q-and-a .question::before {
padding-right: 10px;
content: '――'
}
.cmn-q-and-a .answer {
font-size: 13px;
word-wrap: break-word
}
.cmn-talent-introduction .ttl {
font-weight: 700;
margin-bottom: 10px
}
.slide-in-wrap {
position: relative;
display: inline-block;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.slide-in-wrap::before {
position: absolute;
z-index: 1;
top: 0;
left: 0;
display: inline-block;
width: 0;
height: 100%;
content: '';
background: #000
}
.slide-in-wrap .slide-in {
display: block;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
opacity: 0
}
.slide-in-wrap.slide-in-animation::before {
-webkit-animation: passing-bar .8s ease 0s 1 normal forwards;
animation: passing-bar .8s ease 0s 1 normal forwards
}
.slide-in-wrap.slide-in-animation .slide-in {
-webkit-animation: passing-txt 0s ease .4s 1 normal forwards;
animation: passing-txt 0s ease .4s 1 normal forwards
}
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent
}
.slick-list {
position: relative;
display: block;
overflow: hidden;
margin: 0;
padding: 0
}
.slick-list:focus {
outline: 0
}
.slick-list.dragging {
cursor: pointer;
cursor: hand
}
.slick-slider .slick-list, .slick-slider .slick-track {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
.slick-track {
position: relative;
top: 0;
left: 0;
display: block;
margin-right: auto;
margin-left: auto
}
.slick-track:after, .slick-track:before {
display: table;
content: ''
}
.slick-track:after {
clear: both
}
.slick-loading .slick-track {
visibility: hidden
}
.slick-slide {
display: none;
float: left;
height: 100%;
min-height: 1px;
outline: 0
}
[dir=rtl] .slick-slide {
float: right
}
.slick-slide img {
display: block
}
.slick-slide.slick-loading img {
display: none
}
.slick-slide.dragging img {
pointer-events: none
}
.slick-initialized .slick-slide {
display: block
}
.slick-loading .slick-slide {
visibility: hidden
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent
}
.slick-arrow.slick-hidden {
display: none
}
@font-face {
font-family: slick;
font-weight: 400;
font-style: normal;
src: url(fonts/slick.eot);
src: url(fonts/slick.eot?#iefix) format('embedded-opentype'), url(fonts/slick.woff) format('woff'), url(fonts/slick.ttf) format('truetype'), url(fonts/slick.svg#slick) format('svg')
}
.slick-next, .slick-prev {
font-size: 0;
line-height: 0;
position: absolute;
top: 50%;
display: block;
width: 20px;
height: 20px;
padding: 0;
cursor: pointer;
-webkit-transform: translate(0, -50%);
transform: translate(0, -50%);
color: transparent;
border: none;
outline: 0;
background: 0 0
}
.slick-next:focus, .slick-next:hover, .slick-prev:focus, .slick-prev:hover {
color: transparent;
outline: 0
}
.slick-next:focus:before, .slick-next:hover:before, .slick-prev:focus:before, .slick-prev:hover:before {
opacity: 1
}
.slick-next.slick-disabled:before, .slick-prev.slick-disabled:before {
opacity: .25
}
.slick-next:before, .slick-prev:before {
font-family: slick;
font-size: 20px;
line-height: 1;
opacity: .75;
color: #fff;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale
}
.slick-prev {
z-index: 100;
left: 25px;
background: url(/img/features/outer_collection/ico-back.png) no-repeat center center;
background-size: cover
}
.slick-next {
right: 25px;
background: url(/img/features/outer_collection/ico-next.png) no-repeat center center;
background-size: cover
}
.slick-dots {
line-height: 1;
position: absolute;
bottom: -25px;
display: block;
width: 100%;
margin: 0;
padding: 0;
list-style: none;
text-align: center
}
.slick-dots li {
line-height: 1;
position: relative;
display: inline-block;
width: 8px;
height: 8px;
margin: 5px 5px 0;
padding: 0;
cursor: pointer
}
.slick-dots li button {
/*display: block;
overflow: hidden;
width: 8px;
height: 8px;
padding: 0;
cursor: pointer;
white-space: nowrap;
text-indent: 100%;
border: 0;
border-radius: 8px;
outline: 0;
background: #ccc
*/}
.slick-dots li button:focus, .slick-dots li button:hover {
outline: 0
}
.slick-dots li.slick-active button {
/*  background: #353535
*/}
.block1 {
display: flex;
justify-content: center;
max-width: 1030px;
margin: 0 auto;
}
/*	大枠（div）*/
.cmn-styling {
max-width: 1200px;
margin: 0 auto;
padding:  0
}


/*画像（div）*/
.cmn-styling-group {
margin-bottom: 50px;
}
.cmn-styling-group:last-child {
margin-bottom: 0;
	
}
.cmn-styling-group-last{
margin-bottom: 0;
}
/*	■画像位置（div）
*/.sp-mr-10 {
margin-right: 10%
}
.sp-ml-10 {
margin-left: 10%;
}
.sp-mr-20 {
margin-right: 20%
}
.sp-ml-20 {
margin-left: 20%;
}
.sp-mt-5 {
margin-top: 5%;
}
.sp-mt-10 {
margin-top: 10%;
}

.sp-mt-20 {
margin-top: 20%;
}
.sp-mt-30{
margin-top: 30%;
}
.sp-mt-40 {
margin-top: 40%;
}
.sp-mt-100px{
margin-top: 100px;
}
.sp-mt-120px{
margin-top: 120px;
}
.sp-mb-5 {
margin-top: 5%;
}
.sp-mb-10 {
margin-top: 10%;
}

.sp-mb-20 {
margin-top: 20%;
}
.sp-mb-30{
margin-top: 30%;
}
.sp-mb-40 {
margin-top: 40%;
}
.sp-mb-100px{
margin-top: 100px;
}
.sp-mb-120px{
margin-top: 120px;
}

.block1 {
    display: flex;
    justify-content: center;
    max-width: 1700px;
    margin: 0 auto;
}
.itemlist {
    display: inline-block;
    width: 50%;
    padding: 3px;
}

.cmn-container img {
    width: 100%;
    height: auto;
    vertical-align: bottom;
}








.cmn-styling .cmn-styling-ly-around {
display: flex;
flex-flow: wrap;
justify-content: space-around/* 各アイテムを均等に配置し
各アイテムの両側に半分の大きさの
間隔を置く */
}
.cmn-styling .cmn-styling-ly-around .margin-top {
margin-top: 100px
}
.cmn-styling .cmn-styling-ly-right {
display: flex;
justify-content: flex-end
}
.cmn-styling .cmn-styling-ly-center {
display: flex;
justify-content: center
}


/*画像サイズ（figure）*/
.cmn-styling .width-s {
width: 45%;
max-width: 460px;
}
.cmn-styling .width-m {
/*width: 50%;
max-width: 600px*/
}
.cmn-styling .width-l {
/*width: 90%;
max-width: 800px*/
}
.cmn-styling .width-full {
width: 100%;
max-width: 100%
}	


/*		カルーセル追加		*/
.slider {
width: 70%;
}



.slick-slide img {
width: 100%;
height: auto;
}


.mypattern {
width: 95%;
	margin: 0 auto 70px !important;
}
.mypattern .slick-slide {
/*margin: 10px;
*/}

/*slick setting*/

.mypattern .slick-slide:not(.slick-center) {
-webkit-filter: opacity(70%);
-moz-filter: opacity(70%);
-o-filter: opacity(70%);
-ms-filter: opacity(70%);
filter: opacity(70%);
transition: 0.2s linear;
}

/*slick setting*/

.slick-prev:before,
.slick-next:before {
color: #000;
}


/*		カルーセル		*/




/*    iNella追加    */
.itemlist p {
width: 70%;
}
/*    //iNella追加    */
@media screen and (min-width:600px) and (max-width:959px) {
.cmn-item-lists {
display: -webkit-box;
display: flex;
padding: 0 10px;
flex-wrap: wrap;
-webkit-box-pack: justify;
justify-content: space-between
}
.cmn-item-lists::after {
width: 33.333%;
content: ''
}
.cmn-item-lists .item {
box-sizing: border-box;
width: calc(33.333% - 40px);
margin: 20px
}
.cmn-item-lists .item a {
display: block
}
.cmn-item-lists .item figure {
width: 100%
}
.cmn-item-lists .item ul {
padding: 10px 10px 0
}
}
/*PC*/
@media screen and (min-width:960px) {
.sp {
display: none
}
.pc {
display: block
}
.cmn-container {
/*font-family: 'Noto Serif JP','游ゴシック体',YuGothic,'游ゴシック','Yu Gothic','ヒラギノ角ゴ ProN W3',Hiragino Kaku Gothic ProN,Arial,'メイリオ',Meiryo,sans-serif;*/
	font-family: "Noto Sans JP";
font-weight: 400
}
.cmn-container.padding-top {
padding-top: 50px
}
.cmn-container .PC {
display: block !important
}
.cmn-container .SP {
display: none !important
}
.cmn-visual {
width: 100%;
margin: 0 auto 50px;
padding: 8px 0 0
}
section.style_block {
    margin: 120px auto 0;
}
	
	
.cmn-container .inner {
box-sizing: content-box;
max-width: 1080px;
margin: 0 auto;
padding: 0 20px
}
.cmn-hdg-lv1 {
    /* width: 65%; */
    margin: 0 auto;
    font-size: 40px;
    font-weight: 600;
	text-align: center;


}
.cmn-hdg-lv2 {
    font-size: 30px;
    font-weight: 500;
    line-height: 1.3;
    width: 100%;
    max-width: 840px;
    text-align: center;
    margin: 0px auto 25px;
}
.cmn-hdg-lv3 {
font-size: 20px
}
.cmn-lead {
font-size: 18px
}
.cmn-lead-1 {
font-size: 18px
}
	.cmn-lead-2 {
font-size: 18px
}
	.cmn-lead-3 {
    text-align: center;
    margin: 0px 0 7px !important;
    font-family: 'Abril Fatface', cursive;
    font-size: 18px;
}
	.no-slider {
    margin: 0 auto 20px;
		max-width:410px;
		width:100%;
		padding: 0;
}
.cmn-credit li {
    color: #676767;
    font-size: 14px;
    text-align: center;
    margin-bottom: 5px;
}
	
		.creater-name {
    font-size: 30px;
    margin-bottom: 5px;

	
}
	.cmn-area-hdg-lead p {
/*    margin: 10px 0 60px;
*/}
.creater-category {
    font-size: 16px;
    font-weight: 500;
}
.prof-ig {
    text-align: center;
    display: block;
    margin: 6px 0 50px;
    font-size: 20px;
}
.cmn-card .card-ttl {
font-size: 22px
}

.cmn-credit {
    max-width: 600px;
    margin: 5px auto 45px;
    /* padding: 0 20px; */
    line-height: 1.4;
}
.cmn-fig-credit {
margin-bottom: 120px
}
.cmn-figure.figure-small {
padding: 0 100px
}
.cmn-recommend-owner-list {
margin-bottom: 70px;
}

.cmn-recommend-owner-list ul {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
max-width: 1100px;
margin: auto;
/* color: #fff; */
width: 100%;

}
.cmn-recommend-owner-list ul li {
width: 20%;
}
.cmn-recommend-item {
    margin: 0 auto;
    max-width: 690px;
    width: 100%;
	    margin-bottom: 40px;
}
.cmn-recommend-item.reverse {
flex-direction: row-reverse;
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse
}
.cmn-recommend-item .image {
width: 100%
}
.cmn-recommend-item .txt {
width: 47%
}
.cmn-recommend-item .cmn-btn {;
text-align: left
}
.cmn-recommend-owner {
display: -webkit-box;
display: flex;
margin-bottom: 50px;
-webkit-box-align: center;
align-items: center
}
.cmn-recommend-owner {
margin-top: 50px;
padding-top: 80px;
border-top: 1px solid #ddd;
max-width: 990px;
width: 100%;
margin: 0 auto;
}
.cmn-recommend-owner .avatar {
max-width: 160px;
width: 100%;
}
.cmn-recommend-owner .owner-profile {
padding: 0 20px;
-webkit-box-flex: 1;
flex: 1
}
.cmn-recommend-owner .owner-profile .name {
text-align: left
}
.cmn-recommend-owner .item ul li {
width: 80px
}
.cmn-item-lists {
display: -webkit-box;
display: flex;
padding: 0 10px;
flex-wrap: wrap;
-webkit-box-pack: justify;
justify-content: space-between
}
.cmn-item-lists::before {
-webkit-box-ordinal-group: 2;
order: 1
}
.cmn-item-lists::after, .cmn-item-lists::before {
display: block;
width: calc(25% - 40px);
height: 0;
margin: 20px;
content: ''
}
.cmn-item-lists .item {
box-sizing: border-box;
width: calc(25% - 40px);
margin: 20px
}
.cmn-item-lists .item a {
display: block
}
.cmn-item-lists .item figure {
width: 100%
}
.cmn-item-lists .item ul {
padding: 10px 10px 0
}
.cmn-btn {
margin: 60px 0;
}
.cmn-btn-ivo,.cmn-btn-gry, .cmn-btn-ppl,.cmn-btn-brn,.cmn-btn-pnk{
margin: 0;
margin: 0 0 45px;
}
.cmn-area-look {
background: #f5f5f5;
padding-top: 40px;
}
.cmn-area-look .slide .credit {
display: none
}
.cmn-area-look .slide .txt {
position: absolute;
bottom: 20px;
display: block !important;
width: auto;
height: auto
}
.cmn-area-look .slide .txt a {
color: #353535
}
.cmn-area-look .slide-counter {
font-size: 14px;
right: 20px;
bottom: 20px;
left: auto
}
.cmn-q-and-a {
margin-bottom: 60px
}
.cmn-q-and-a .question {
font-size: 18px;
margin-bottom: 15px
}
.cmn-q-and-a .question::before {
padding-right: 10px;
content: '――'
}
.cmn-q-and-a .answer {
font-size: 16px
}
.staff {
    text-align: center;
    line-height: 2;
    margin: 100px 0 80px;
}
	
/*    iNella追加    */
.inner {
box-sizing: content-box;
/*    max-width: 1080px;
*/ margin: 0 auto;
padding: 0 20px;
}
.cmn-area-hdg-lead {
    margin: 60px 0px 15px;
}
.cmn-area-hdg-prof {
margin: 60px 0px 35px;
}	
.cmn-hdg-lv1 {
/*width: 100%;
max-width: 400px;
margin: 0 auto;
*/  }
.cmn-hdg-lv1-sub {
font-size: 25px;
}
.cmn-line {
text-align: center;
font-size: 1.4rem;
margin: 2rem auto;
}

.cmn-lead-2 {
    margin: 0px auto 60px !important;
    /* text-align: center; */
    max-width: 870px;
    width: 100%;
    line-height: 1.8;
}

.cmn-lead:last-child {
margin-bottom: 0;
/* text-align: center; */
max-width: 770px;
width: 100%;
margin: 0 auto;
}
.box {
width: 100%;
}
.block1 {
    display: flex;
    justify-content: center;
    max-width: 900px;
    margin: 0 auto;
}
.itemlist {
    display: inline-block;
    width: 45%;
    margin: 0px 0 40px 0;
    padding: 10px;
}
.item_caption {
width: 70%;
margin-bottom: 30px;
}
.buy_btn {
float: right;
font-size: 14px;
width: 120px;
margin: 10px 0;
}
.icn-buy {
color: #fff;
background: #222;
padding: 10px;
text-decoration: none;
padding: 1px 15px;
margin-left: 10px;
}

   .coatitemlist{
        width: 55%;
    margin: 0 auto;
} 
    
    
    
    
    
    
    
/*	大枠（div）*/
.cmn-styling {
max-width: 1200px;
margin: 0 auto;
padding: 0 0 50px;
}


/*画像（div）*/
.cmn-styling-group {
margin-bottom: 80px;
}

/*	■画像位置（div）
*/.sp-mr-10 {
margin-right: 10%
}
.sp-ml-10 {
margin-left: 10%;
}
.mr-20 {
margin-right: 20%
}
.ml-20 {
margin-left: 20%;
}
.mt-5 {
margin-top: 5%;
}
.mt-10 {
margin-top: 10%;
}

.mt-20 {
margin-top: 20%;
}
.mt-30{
margin-top: 30%;
}
.mt-40 {
margin-top: 40%;
}
.mt-100px{
margin-top: 100px;
}
.mt-120px{
margin-top: 120px;
}
.mb-5 {
margin-top: 5%;
}
.mb-10 {
margin-top: 10%;
}

.mb-20 {
margin-top: 20%;
}
.mb-30{
margin-top: 30%;
}
.mb-40 {
margin-top: 40%;
}
.mb-100px{
margin-top: 100px;
}
.mb-120px{
margin-top: 120px;
}





.cmn-styling .cmn-styling-ly-around {
display: flex !important;
flex-flow: wrap;
justify-content: space-around/* 各アイテムを均等に配置し
各アイテムの両側に半分の大きさの
間隔を置く */
}
.cmn-styling .cmn-styling-ly-around .margin-top {
margin-top: 100px
}
.cmn-styling .cmn-styling-ly-right {
display: flex;
justify-content: flex-end
}
.cmn-styling .cmn-styling-ly-center {
display: flex;
justify-content: center
}


/*画像サイズ（figure）*/
.cmn-styling .width-s {
width: 45%;
max-width: 460px;
}
.cmn-styling .width-m {
width: 50%;
max-width: 600px
}
.cmn-styling .width-l {
width: 90%;
max-width: 700px
}
.cmn-styling .width-full {
width: 100%;
max-width: 100%
}	

.mypattern {
width: 60%;
}
/*	ITEM: 		;*/	
.gray-box{
padding: 50px 50px 30px;
}
.article-parts-profile {
/* margin-bottom: 75px; */
background: #e6e6e6;
border: 1px solid #dadada;
padding: 20px 65px 30px;
position: relative;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
/* margin-bottom: 35px; */
width: 100%;
max-width: 520px;
margin: 0 auto 35px;
}
.article-parts-headtitle-2{
font-size: 20px;
font-weight: 700;
line-height: 1.8;
}
.caption {
    text-align: center;
    margin-top: 30px;
    font-size: 20px;
    margin: 20px 0 80px;
    line-height: 2;
}
.cmn-styling-group-last{
margin-bottom: 0;
}

}
/*    SP     */
@media screen and (max-width:959px) {
.cmn-area-look .slide .credit {
font-size: 13px;
font-weight: 700;
line-height: 1;
position: absolute;
bottom: 20px;
padding: 3px 10px;
border: 1px solid currentColor;
border-radius: 3px;
background: #fff
}
.cmn-area-look .slide .txt {
position: absolute;
top: 0;
left: 0;
display: none;
width: 100%;
height: 100%;
color: #fff;
background: rgba(0, 0, 0, .8);
-webkit-box-align: center;
align-items: center;
-webkit-box-pack: center;
justify-content: center
}
.cmn-area-look .slide .txt li {
margin: 10px 0
}
.cmn-area-look .slide .txt a {
border-bottom: 0
}
/*  追加    */
.inner {
box-sizing: content-box;
max-width: 1080px;
margin: 0 auto;
}

.cmn-hdg-lv1 {
    /* width: 65%; */
    margin: 0 auto;
    font-size: 36px;
    font-weight: 600;
	text-align: center;
	background-color: transparent;


}
.cmn-area-hdg-lead {
    margin: 40px 0 0;
    padding: 0 15px;
    line-height: 1.4;
    font-size: 13px;
}
	
.cmn-area-hdg-prof {
    margin-bottom: 40px;
    padding: 0 10px;
    background: #e6e6e6;
    padding: 20px;
	font-size: 13px;
}
.prof-ig {
    text-align: center;
    display: block;
    margin-top: 4px;
    font-size: 16px;
}
	

.itemlist:last-child {
margin-bottom: 15px;
}
.itemlist p {
margin: 5px 0 25px;
font-size: 14px;
width:100%;
}
.item_caption {
width: 100%;
margin-bottom: 30px;
}	
.icn-buy {
color: #fff;
background: #222;
padding: 10px;
text-decoration: none;
padding: 1px 15px;
margin-left: 10px;
}
	
	/*	ITEM: 		;*/	
.gray-box{
padding: 50px 50px 30px;
}
.article-parts-profile {
    /* margin-bottom: 75px; */
    /* background: #e6e6e6; */
    /* border: 1px solid #dadada; */
    /* padding: 20px 65px 30px; */
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    /* margin-bottom: 35px; */
    width: 100%;
    max-width: 520px;
    margin: 0 auto 35px;
}
.article-parts-headtitle-2{
font-size: 20px;
font-weight: 700;
line-height: 1.8;
}

.caption {
    text-align: center;
    margin: 10px 0 80px;
    font-size: 16px;
    line-height: 2.2;
}


}
/*   // 追加    */
@-webkit-keyframes passing-bar {
0% {
left: 0;
width: 0
}
50% {
left: 0;
width: 100%
}
51% {
left: 0;
width: 100%
}
100% {
left: 100%;
width: 0
}
}
@keyframes passing-bar {
0% {
left: 0;
width: 0
}
50% {
left: 0;
width: 100%
}
51% {
left: 0;
width: 100%
}
100% {
left: 100%;
width: 0
}
}
@-webkit-keyframes passing-txt {
0% {
opacity: 0
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}
@keyframes passing-txt {
0% {
opacity: 0
}
50% {
opacity: 0
}
100% {
opacity: 1
}
}