@charset "utf-8";

.mincho { font-feature-settings: "liga" off; font-family: Shippori Mincho, serif; font-weight: 500; }
.garamond { font-family: EB Garamond,serif; line-height: .86; font-weight: 400; }
.tight { font-family: Inter Tight, ヒラギノ角ゴ Pro W3, Hiragino Kaku Gothic Pro W3, 游ゴシック体, YuGothic, Yu Gothic M, 游ゴシック Medium, sans-serif; }



.box {font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","Meiryo","Osaka","ＭＳ Ｐゴシック","MS P Gothic",Verdana,Arial,Helvetica,sans-serif; -webkit-text-size-adjust: 100%;}

#EC_design {font-size:inherit;}

#main {float:left; width:700px; margin-top:20px; padding-bottom:70px; background:#fff; color:#000;}
.smartphone main .main_inner{ overflow: visible; }


#content{-webkit-font-smoothing: antialiased; width: auto; float:none;}
#content header {border:0; margin: 0; padding: 0; }
#content header .image {text-align: center;}
#content header .image img { width: 100%; margin: 0 auto;}
.smartphone #content header .image { margin: 0 -7.14%; }
.smartphone #content header .image img{ width: 100%; }

#content time { font-size: 14px; margin-bottom:20px; font-family: 'Montserrat',Verdana,Arial,Helvetica,sans-serif; color:#999;}
#content h2 {font-size:22px; font-family:"Montserrat",Verdana,Arial,Helvetica,sans-serif; font-weight:bold; margin-bottom:10px; line-height: 1.4}
#content h2 span { display: inline-block; word-break:keep-all; }
#content h2 small {font-size:0.8em; font-weight: normal; }
#content h3 {font-size:13px; font-weight:normal; margin-bottom:20px;}
#content h3 span.info {display: block; /*border-top: 1px solid #ddd; padding-top:14px; */margin-top:8px; }
#content h3 p {display: block; padding-bottom:1px; font-size: inherit; line-height: 1.8; margin:0;}
#content h4 {font-size:1.3em; font-weight:normal; margin-bottom:6px; text-align:center;}
.smartphone #content time {margin-bottom:10px; text-align:center;}
.smartphone #content h2 {font-size:18px; margin-bottom:10px; text-align:center;}
.smartphone #content h2 span {display: inline-block; word-break:keep-all; }
.smartphone #content h3 {font-size:14px; line-height:1.6; text-align:center;}
.smartphone #content h3 span {text-align:center;}
.smartphone #content h3 p {text-align:center; font-size: 13px; margin-top:4px;}


#content .en {font-family: 'Montserrat',Verdana,Arial,Helvetica,sans-serif;}

#content br.onlySP,
#content br.onlySP--force{ display: none; }
#content .pc_view {display:inline;}
#content .smp_view {display:none;}
.smartphone #content br.force,
.smartphone #content br.onlySP--force { display: inline-block!important; }
.smartphone #content .pc_view {display:none;}
.smartphone #content .smp_view {display:inline;}
.smartphone #content .smp_hidden {display:none;}
.smartphone #content br.onlySP{ display: inline; }



a.black-bg{ display: inline-block!important; margin: 0 auto; position: relative; }
a.black-bg img{ opacity: 1!important; position: relative; }
a.black-bg:before{ background-color: #9f9f9f; border-radius: 4px; content: " "; display: block; height: 100%; margin: -5px 0 0 -20px; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; opacity: 0; padding: 5px 20px; position: absolute; left: 0; top: 0; transition: opacity .4s ease; width: 100%; }
a.black-bg:hover:before{ opacity: 1; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=1)"; }




/* introduction */
#content #introduction { padding: 40px 0; }
#content #introduction-inner {letter-spacing: normal;}
#content #introduction h3 strong,
#content #introduction h3 span { display: block; }
#content #introduction h3 strong { padding: 0 0 8px; }
#content #introduction h3 span { font-size: 12px; }
#content #introduction h4 {font-size:18px; color:#363636; font-weight: normal; margin-top: 80px;}
#content #introduction *{ text-align: center; }
#content #introduction p{ line-height: 32px; }
.smartphone #content #introduction{ padding: 40px 0; margin: 0;}
.smartphone #content #introduction h3 { margin-bottom: 30px; }
.smartphone #content #introduction h3 img{ }
.smartphone #content #introduction h4 {font-size:16px; }
.smartphone #content #introduction p{ font-size: 14px; line-height: 1.8; }
.smartphone #content #introduction p span { display: inline-block;  word-break:keep-all; }
.smartphone #content #introduction p br{ display: none; }




/* .section */
#content .section{ padding: 46px 0 0; }
#content .section:before { background: url(images/line.png) repeat-x top center; content: " "; display: block; height: 30px; margin: -30px 0 110px; width: 100%; }
.smartphone #content .section{ background-size: auto 50px; margin: -30px -7.13% 30px; padding-top: 30px; }
.smartphone #content .section > *{ margin: 0 5px; }
.smartphone #content .section:before { margin: 0 0 50px; background-repeat: repeat-x; }

#content .section .description{ font-size: 18px; line-height: 32px; margin: 0; position: relative; text-align: center; }
/*#content .section .description:before,
#content .section .description:after{ content: " "; display: block; left: 50%; position: absolute; }*/
#content .section .description sup { vertical-align: super; font-size: 9px; }
.smartphone #content .section .description { font-size: 16px; line-height: 1.8; letter-spacing: 0; margin: 0 5px;}
.smartphone #content .section .description br { }
.smartphone #content .section .description span {display: inline-block;}
/* .smartphone #content .section .description:before,
.smartphone #content .section .description:after{ background-size: contain; content: " "; display: block; left: 50%; position: absolute; }
.smartphone #content .section .description:before{ height: 17px; margin: 0 0 0 -25px; top: -20px; width: 50px; }
.smartphone #content .section .description:after{ bottom: -12px; height: 8px; margin: 0 0 0 -22px; width: 44px; }
*/

#content .section .img{ padding: 50px 0 30px; text-align: center; position: relative;}
.smartphone #content .section .img { padding: 30px 0; }
.smartphone #content .section .img img{ height: auto; max-width: 95%; }

#content .section .meta{ width: auto; position: relative;}
#content .section .meta *{ text-align: center; }
#content .section .meta h5 { font-size:16px; line-height:26px; color:#9fa0a0; margin-bottom:25px;}
#content .section .meta .icon { display: block; width: 80px; font-size: 11px; margin: 0 auto 17px; padding:2px 20px; border: 1px solid #aaa; background: #fff;}
#content .section .meta .release{ display: block; font-size: 13px; padding: 0 0 4px; }
#content .section .meta .reserve { display: block; font-size: 12px; margin: 0 0 13px; }
#content .section .meta .ec { display: block; font-size: 12px; margin: -6px 0 16px; line-height: 1.6;}
#content .section .meta .reserve_ec { display: block;; font-size: 12px; margin: 0;}
#content .section .meta .title { margin-bottom: 8px;}
#content .section .meta .title > strong{ color: #333; display: block; font-size: 20px; line-height: 28px; padding: 0 0 18px; letter-spacing: 0; }
#content .section .meta .title > span{ color: #999; display: block; font-size: 11px; line-height: 17px; }
#content .section .meta .title > strong > span,
#content .section .meta .title > span > span { display: inline-block;  word-break:keep-all; font-size: inherit; }
#content .section .meta .price{ font-size: 13px; line-height: 1.6; padding: 0 0 8px; margin: 0; }
#content .section .meta .price small{ font-size: 11px; }
#content .section .meta .kome { font-size: 11px; line-height: 1.6; padding: 0 0 8px; margin: 0; }
#content .section .meta .color { padding: 20px 0 40px; }
#content .section .meta .colors { border: none!important; padding: 8px 0 20px;!important; margin: 0; }
#content .section .meta .colors li { padding-top: 0!important; }
.smartphone #content .section .meta h5 { font-size:14px; line-height:1.6; }
.smartphone #content .section .meta .icon { margin: 0 auto 16px; }
.smartphone #content .section .meta .release{ font-size: 12px; padding: 0 0 4px; }
.smartphone #content .section .meta .reserve { font-size: 12px; margin: 0 0 16px; }
.smartphone #content .section .meta .ec { font-size: 12px; }
.smartphone #content .section .meta .reserve_ec { display: block; font-size: 11px; }
.smartphone #content .section .meta .title > strong{ font-size: 18px; line-height: 1.6; padding: 0 0 15px; letter-spacing: 0;}
.smartphone #content .section .meta .title > span{ font-size: 10px; line-height: 1.4; }
.smartphone #content .section .meta .title > strong > span,
.smartphone #content .section .meta .title > span > span { display: inline-block;  word-break:keep-all; font-size: inherit; }
.smartphone #content .section .meta .price{ font-size: 12px; line-height: 1.4; padding: 0 0 15px; }
.smartphone #content .section .meta .price span { display: inline-block;}
.smartphone #content .section .meta .colors ul{ justify-content: center; }

#content .section .more{ padding: 0 0 30px; text-align: center; }
#content .section .more > *{ display: inline-block; vertical-align: middle; text-align: left; }
#content .section .more dd{ font-size: 12px; line-height: 18px; padding: 0 0 0 10px; width: 160px; }
.smartphone #content .section .more dt img{ max-height: 80px; max-width: 90px; }
.smartphone #content .section .more dd{ font-size: 11px; line-height: 1.6; }

#content .section .detailBtn,
#content .section .cartBtn { background-color: #333; color: #fff; display: block; font-family: 'Montserrat',Verdana,Arial,Helvetica,sans-serif; font-size: 14px; font-weight: bold; line-height: 1.4; padding: 10px 0; margin: 10px auto 0; transition: opacity .4s ease; text-align: center; width: 265px; }
#content .section .detailBtn:hover,
#content .section .cartBtn:hover{ opacity: .8; color: #fff !important;}

#content .section .cartBtn-s { border-bottom: 1px solid #333; box-sizing: border-box; color: #333; display: inline-block; font-size: 11px; font-weight: bold; line-height: 1.2; letter-spacing: 0; margin-top: 10px; }
#content .section .cartBtn-s:before { background: url(/img/jill/images/sp/general/icon_cart.png) no-repeat 0; background-size: 16px; content: " "; display: inline-block; height: 12px; padding: 0 4px 0 0; position: relative; top: 1px; width: 16px; }
#content .section .cartBtn-s:hover { opacity: .6; }
.smartphone #content .section .detailBtn,
.smartphone #content .section .cartBtn{ max-width: 320px; }

#content .section__footer { display: block; text-align: right; margin: 10px 0; }
#content .section__footer .limited { display: block; text-align: right; font-size: 11px; margin: 0 0 160px; padding: 0; line-height: 17px; }
#content .section__footer .limited .kome { font-size: 10px; }
#content .section__footer .pagetop { display: inline-block; text-align: right; background: url(/img/jill/images/pc/general/icon_up.png) no-repeat; color: #333; font-size: 12px; padding: 0 0 0 16px; }
#content .section__footer.right { justify-content:flex-end; margin-top: -20px; }
#content .section__footer.right .limited { text-align: right; }
.smartphone #content .section__footer { align-items: flex-end; flex-direction: column; margin: 0 4% -30px; }
.smartphone #content .section__footer .limited { font-size: 11px; padding: 0 0 8px; margin-bottom: 120px; }
.smartphone #content .section__footer .pagetop { font-size: 11px; }




/* .colors */
#content div[class^="colors"]{ margin: 66px 0 -50px; position: relative; }
#content div[class^="colors"].no-border{ border: 0; margin-top: 0; }
#content div[class^="colors"].no-border li { padding-top: 0; }
#content div[class^="colors"] h5{ font-size: 16px; line-height: 28px; padding: 0 0 40px; text-align: center; }
#content div[class^="colors"] ul{  display: flex; flex-wrap: wrap; justify-content:center; font-size: 0; margin-top: 0; text-align: center;}
#content div[class^="colors"] li{ display: flex; justify-content: space-between; flex-direction: column; align-items: center; padding: 0 0 56px; vertical-align: top; text-align: center; width: 175px; }
#content div[class^="colors"] li  * { display: block; text-align: center; }
#content div[class^="colors"] li img { margin: 0 auto 12px; }
#content div[class^="colors"] li strong { display: block; font-family: 'Montserrat',Verdana,Arial,Helvetica,sans-serif; color: #333; font-size: 12px; padding: 0 0 8px; line-height: 17px; font-weight: bold; letter-spacing: normal; }
#content div[class^="colors"] li strong span { display: block; font-size: 12px; font-weight: normal; padding:0; text-align: center; }
#content div[class^="colors"] li strong small { display: inline-block; font-size: 12px; font-weight: normal; }
#content div[class^="colors"] li p { font-size: 10px; line-height: 1.6; letter-spacing: 0; color: #333; margin: 0; }
#content div[class^="colors"] li p span { display: inline; }
#content div[class^="colors"] .limited{ bottom: -1em; font-size: 11px; margin: 0; padding: 0; position: absolute; right: 0; text-align: right; }
#content .section .colors-1col ul li { width: auto; }
#content .section .colors-2col ul { justify-content: center; }
#content .section .colors-2col ul li { width: 250px; }
#content .section .colors-3col ul { width: auto; margin: 0 auto; }
#content .section .colors-3col ul li { width: 200px; }
#content .section .colors-4col ul li{ width: 212px; }
#content .section .colors-5col ul li{ width: 130px; }
#content .section .colors-6col ul li{ width: 107px; }
.smartphone #content div[class^="colors"]{ position: relative; margin: 30px auto 50px; /*max-width: 320px;*/width: 100%; }
.smartphone #content div[class^="colors"] > ul{ display: flex; flex-wrap: wrap; text-align: left; }
.smartphone #content div[class^="colors"] h5{ font-size: 12px; line-height: 18px; }
.smartphone #content div[class^="colors"] .note { width: auto; }
.smartphone #content div[class^="colors"] > ul > li{ padding: 70px 0 0; width: 48%; }
.smartphone #content div[class^="colors"] > ul > li strong{ font-size: 12px; }
.smartphone #content div[class^="colors"] > ul > li p { font-size: 10px; }
.smartphone #content div[class^="colors"] > ul > li p br{ display: none; }
.smartphone #content div[class^="colors"] > ul > li img { margin-bottom: 15px; max-width: 100%; }
.smartphone #content div[class^="colors"] .limited{ text-align: left; }
.smartphone #content div[class^="colors"] {margin: 0 4px 50px; width: auto;}
.smartphone #content div[class^="colors"] > ul {}
.smartphone #content div[class^="colors"] > ul > li {width: calc(33.3% - 4px); padding: 70px 2px 0; /*margin-bottom: 26px;*/}
.smartphone #content div[class^="colors"] > ul > li p span { display: inline-block;  word-break:keep-all; font-size: inherit; width: auto !important; }
.smartphone #content .section .colors-1col > ul { justify-content: center; }
.smartphone #content .section .colors-1col > ul > li { width: auto; }
.smartphone #content .section .colors-2col > ul { justify-content: center; }
.smartphone #content .section .colors-2col > ul > li { width: calc(50% - 6px); padding: 70px 3px 0;}
.smartphone #content .section .colors-3col > ul { width: auto; justify-content: space-around; }
.smartphone #content .section .colors-3col > ul > li { width: calc(50% - 6px); padding: 70px 3px 0;}
.smartphone #content .section .colors-4col > ul { width: auto; justify-content: space-around; }
.smartphone #content .section .colors-6col > ul { width: auto; justify-content: space-around; }




/* toggle */
#content .toggle__body { visibility:hidden; height: 0; opacity: 0; flex-wrap: wrap; justify-content: center; padding: 0;
  -webkit-transition: all 1.0s;
	-moz-transition: all 1.0s;
	-ms-transition: all 1.0s;
	-o-transition: all 1.0s;
	transition: all 1.0s;
  overflow: hidden;
}
#content .toggle__buttons { text-align: center; }
#content .toggle__button { }
#content .toggle__button:hover { opacity: .8; }
#content .toggle__button--detail { background: #fbfbfb; color: #333; border: 1px solid #efefef; border-radius: 5px; cursor: pointer; display: inline-flex; justify-content: center; align-items: center; font-size: 13px; line-height: 22px; text-align: center; transition: opacity .4s ; width: 100%; padding: 22px 0; position: relative;}
#content .toggle__button--detail:after { content: ""; background: url("images/icon_down.png") no-repeat center; display: inline-block; width: 35px; height: 18px; margin-left: 10px; position: absolute; right: 18px;}
#content .toggle__button--detail > span { display: inline-block; text-align: center; }
#content .toggle__button--detail > span > span { display: inline-block; }
#content .toggle__button--close { font-size: 12px; display: none; margin-top: 30px; text-align: center;}
#content .toggle__button--close:hover { opacity: .8; cursor: pointer; }
#content .toggle__button--close:after { content: ""; background: url("images/icon_down.png") no-repeat center top -6px; display: inline-block; width: 25px; height: 12px; margin-left: 10px; transform: rotate(180deg) scale(1); }
.smartphone #content .toggle__button--detail { font-size: 12px; line-height: 18px; }
.smartphone #content .toggle__button--detail:after { background-size: 22px auto; right: 10px; }
.smartphone #content .toggle__buttons { margin-bottom: 30px; }
.smartphone #content .toggle__button { }
.smartphone #content .toggle__button--detail { width: 100%; padding: 10px 0; margin: 0; }




/* checked */
#content .toggle { height: 1px; left: -9999px; position: absolute; visibility: hidden; width: 1px; }
#content .toggle:checked ~ .toggle__body { visibility: visible; height: auto; opacity: 1; }
#content .toggle:checked ~ .toggle__body .toggle__button--close { display: block; }
#content .toggle:checked ~ .toggle__buttons .toggle__button--detail { display: none; }



/* makeup */
#content #makeup{ }
#content #makeup h3{ text-align: center; margin-bottom: 7px; }
#content #makeup .description{ font-size: 14px; }
#content #makeup .makeup-main{ overflow: hidden; padding: 60px 0 0; zoom: 1; }
#content #makeup .makeup-data{ border-bottom: 1px solid #666; }
#content #makeup .makeup-data h4{ margin: 0 0 17px; padding: 40px 4px 0; text-align: left; border-bottom: 1px solid #666;}
#content #makeup .makeup-data h4 img { margin-bottom: -2px; }
#content #makeup .makeup-data dl { font-size: 11px; padding: 0 0 0 5px; letter-spacing: 0; }
#content #makeup .makeup-data dl * { color: inherit; }
#content #makeup .makeup-data dl a { display: block; margin-bottom: 20px; }
#content #makeup .makeup-data dl .pink{ color: #b27bb3; }
#content #makeup .makeup-data dd { }
#content #makeup .makeup-howto h4{ font-size: 18px; font-weight: normal; margin-bottom: 20px; }
#content #makeup .makeup-howto h4 img { }
#content #makeup .makeup-howto > div{ padding: 0 0 25px; }
#content #makeup .makeup-howto > div:last-child { padding-bottom: 0; }
#content #makeup .makeup-main .left{ float: left; width: 280px; }
#content #makeup .makeup-main .right{ border: 1px solid #b27bb3; border-radius: 8px; float: right; padding: 20px 13px 25px 20px; width: 313px; }
#content #makeup .makeup-main h5{ padding: 0 0 12px; }
#content #makeup .makeup-main p,
#content #makeup .makeup-main ol{ font-size: 12px; letter-spacing: 0; line-height: 1.7; margin: 0; padding: 0; color: #363636; }
#content #makeup .makeup-main ol li{ padding: 0 0 7px; overflow: hidden; text-indent: -1rem; padding-left: 1rem; zoom: 1; line-height: 1.7; }
#content #makeup .makeup-main .eyes img.img1{ float: right; margin: 0 0 8px 8px; }
#content #makeup .makeup-main .eyes .img{ margin: 5px 0 0; padding: 0; text-align: center; }
#content #makeup .makeup-main .blush img.img3{ float: right; margin: 0 0 8px 8px; }
#content #makeup .makeup-main .blush .img{ margin: 0; padding: 0; text-align: center; }
.smartphone #content #makeup{ }
.smartphone #content #makeup h3 img{ width: 220px; }
.smartphone #content #makeup .description{ font-size: 12px; margin-top: 15px; }
.smartphone #content #makeup .makeup-main{ margin: 0; padding: 0; width: 100%; }
.smartphone #content #makeup .makeup-main .left{ text-align: center; }
.smartphone #content #makeup .makeup-main .left > img{ width: 280px; }
.smartphone #content #makeup .makeup-data{ box-sizing: border-box; margin: 0 5px 30px; }
.smartphone #content #makeup .makeup-data h4{ margin: 0 0 10px; padding-top: 40px; text-align: left; }
.smartphone #content #makeup .makeup-data h4 img{ }
.smartphone #content #makeup .makeup-data dl{ font-size: 11px; padding: 0 0 0 5px; letter-spacing: 0; }
.smartphone #content #makeup .makeup-data dl .pink{ color: #b27bb3; }
.smartphone #content #makeup .makeup-data dl a {display: block; margin-bottom: 10px; }
.smartphone #content #makeup .makeup-data dd{ }
.smartphone #content #makeup .makeup-howto h4{ font-size: 18px; font-weight: normal; }
.smartphone #content #makeup .makeup-howto > div{ padding: 0 0 15px; }
.smartphone #content #makeup .makeup-main .left{ float: none; width: 100%; }
.smartphone #content #makeup .makeup-main .right{ float: none; margin: 0 5px; width: auto; padding: 20px 10px;}
.smartphone #content #makeup .makeup-main h5{ padding: 0 0 5px; }
.smartphone #content #makeup .makeup-main p,
.smartphone #content #makeup .makeup-main ol{ font-size: 12px; letter-spacing: 0; line-height: 18px; margin: 0; padding: 0; }
.smartphone #content #makeup .makeup-main ol li{ }
.smartphone #content #makeup .makeup-main .eyes img.img1{ float: right; margin: 0 0 5px 5px; }
.smartphone #content #makeup .makeup-main .eyes .img{ margin: 0 auto; padding: 0; text-align: center; width: 100%; max-width: 282px;}
.smartphone #content #makeup .makeup-main .blush img.img3{ float: right; margin: 0 0 5px 5px; }
.smartphone #content #makeup .makeup-main .blush .img{ margin: 0; padding: 0; text-align: center;}

/* fashion *
#content #fashion .fashion__title { margin: 0 0 60px; text-align: center; }
#content #fashion .main { display: flex; justify-content: space-between; padding: }
#content #fashion .main__text { width: 308px; }
#content #fashion .main__img { width: 326px; }
#content #fashion .main__text p { font-size: 13px; margin: 0; padding: 0; }
#content #fashion .main__title { margin: 0; padding: 0 0 12px; }
#content #fashion .main__title strong{ color: #333; display: block; font-size: 15px; font-weight: normal; }
#content #fashion .main__title span { display: block; font-size: 10px; font-weight: normal; }
#content #fashion .main__detail { font-size: 11px; line-height: 18px; padding: 10px 0 0; }
#content #fashion .main__detail dt { padding: 4px 0 0; text-indent: -.5em; }
.smartphone #content #fashion .fashion__title { margin-bottom: 30px; }
.smartphone #content #fashion .fashion__title img { width: 216px; }
.smartphone #content #fashion .main { display: block; }
.smartphone #content #fashion .main__text { width: 100%; }
.smartphone #content #fashion .main__img { text-align: center; width: 100%; }
.smartphone #content #fashion .main__img img { width: 100%; }
.smartphone #content #fashion .main__text p { font-size: 12px; }
.smartphone #content #fashion .main__text p br { display: none; }
.smartphone #content #fashion .main__title { margin: 0; padding: 0 0 12px; }
.smartphone #content #fashion .main__title strong{ font-size: 13px; font-weight: bold; }
.smartphone #content #fashion .main__title span { font-size: 10px; letter-spacing: 0; }
.smartphone #content #fashion .main__detail { margin: 0 0 24px; }
.smartphone #content #fashion .main__detail dt { text-indent: -.5em; }

/* fashion - makeup *
#content #fashion .make { padding: 0; }
#content #fashion .make .make__title { text-align: left; margin-bottom: 13px; }
#content #fashion .make__makeupby { text-align: left; }
#content #fashion .make__body { display: flex; justify-content: space-between; }
#content #fashion .make__img { width: 392px; }
#content #fashion .make__main {  padding: 0; width: 240px; }
#content #fashion .make__makeupby { padding: 0 0 4px; }
#content #fashion .makes { display: flex; justify-content: space-between; }
#content #fashion .makes__left,
#content #fashion .makes__right { overflow: hidden; zoom: 1; }
#content #fashion .makes img { clear: both; float: left; margin-right: 8px; }
#content #fashion .makes p { font-size: 11px; letter-spacing: 0; line-height: 16px; margin: 0; padding: 0; }
#content #fashion .makes > div { position: relative; }
#content #fashion .makes > div:before { content: " "; display: block; float: left; width: 1px; }
#content #fashion .makes__left { width: 270px; }
#content #fashion .makes__left:before { height: 108px; }
#content #fashion .makes__right { width: 204px; }
#content #fashion .makes__right:before { height: 92px; }
#content #fashion .makes__title { font-weight: bold; padding: 0 0 4px; text-indent: -.5em; }
.smartphone #content #fashion .make { padding: 32px 0 0; }
.smartphone #content #fashion .make .make__title img { width: 100%; max-width: 300px; }
.smartphone #content #fashion .make__makeupby { text-align: left; }
.smartphone #content #fashion .make__body { display: block; }
.smartphone #content #fashion .make__img { margin: 0 0 24px; text-align: center; width: 100%; }
.smartphone #content #fashion .make__img img { width: 100%; }
.smartphone #content #fashion .make__main { padding: 0; width: 100%; }
.smartphone #content #fashion .make__makeupby { padding: 0 0 12px; text-align: center; }
.smartphone #content #fashion .makes { display: block; }
.smartphone #content #fashion .makes__left,
.smartphone #content #fashion .makes__right { border-top: 1px solid #e2e2e2; overflow: hidden; padding: 24px 0; zoom: 1; }
.smartphone #content #fashion .makes img { margin-bottom: 2px; }
.smartphone #content #fashion .makes p { font-size: 11px; letter-spacing: 0; line-height: 16px; margin: 0; padding: 0; }
.smartphone #content #fashion .makes > div { position: relative; }
.smartphone #content #fashion .makes > div:before { display: none; }
.smartphone #content #fashion .makes__left { width: 100%; }
.smartphone #content #fashion .makes__right { width: 100%; }
.smartphone #content #fashion .makes__title { font-size: 12px; padding: 0 0 16px; text-align: center; }






/*
 *
 * for this page
 *
 */
#content .image { margin: 0; }
#content #introduction-wrapper { width: 100%; padding: 84px 0 80px; margin: 0 auto; position: relative; background: #fcebf2; }
#content #introduction-wrapper .flower1,
#content #introduction-wrapper .flower2,
#content #introduction-wrapper .flower3 { position: absolute; }
#content #introduction-wrapper .flower1 { top: 457px; left: 0; }
#content #introduction-wrapper .flower2 { top: 170px; right: 30px; }
#content #introduction-wrapper .flower3 { top: 735px; right: 250px; }
#content #introduction { padding: 0; margin: 0 142px 97px; position: relative; border: 2px solid #9ea3a6; }
#content #introduction:before,
#content #introduction:after { position: absolute; top: -24px; left: -24px; content:""; display: block; background: url("images/deco.png") no-repeat; height: 57px; width: 720px; }
#content #introduction:after { top: auto; bottom: -24px; transform:rotate(180deg); }
#content #introduction #introduction-inner { margin: 5px; padding: 63px 70px 73px; border: 1px solid #9ea3a6; }
#content #introduction *{ text-align: center; }
#content #introduction h3 {margin:0 0 54px;}
#content #introduction h3 strong { padding: 0; }
#content #introduction h4 { margin: 50px 0 40px; }
#content #introduction p{ line-height: 32px; font-size: 14px; color: #4c4948; margin: 1em 0 0; }
#content #introduction p span { display: inline-block; word-break:keep-all; }
#content #introduction2 { padding: 180px 0 190px; margin: 0; position: relative; background: url("images/introduction_bg2.png") no-repeat top center; }
#content #introduction2 * { text-align: center; }
#content #introduction2 h3 {margin:0 0 54px;}
#content #introduction2 p{ line-height: 32px; font-size: 14px; color: #4c4948; margin: 1em 0 0; }
#content #introduction2 p span { display: inline-block; word-break:keep-all; }
.smartphone #content #introduction-wrapper { width: auto; margin: 0 -7.14% 70px; padding: 0; overflow: hidden; }
.smartphone #content #introduction-wrapper .flower1 { top: -21px; left: -10px; width: 150px; transform: rotate(40deg); }
.smartphone #content #introduction-wrapper .flower2 { top: -28px; right: -60px; width: 150px; transform: rotate(323deg); }
.smartphone #content #introduction-wrapper .flower3 { top: 240px; right: -10px; width: 70px; transform: rotate(0deg); }
.smartphone #content #introduction { padding: 0; border: 0; }
.smartphone #content #introduction:before,
.smartphone #content #introduction:after { display: none; }
.smartphone #content #introduction #introduction-inner { padding: 105px 9% 0; margin: 0; border: 0; }
.smartphone #content #introduction h3 { margin-bottom: 40px; }
.smartphone #content #introduction h3 img { width: 96%; max-width: 372px; }
.smartphone #content #introduction p{ line-height: 2; margin-top: 1rem; }
.smartphone #content #introduction p br{ display: none; }
.smartphone #content #introduction2 { background-size: auto 100%; }
.smartphone #content #introduction2 h3 { margin-bottom: 40px;}
.smartphone #content #introduction2 h3 img { width: 70%; max-width: 346px;}
.smartphone #content #introduction2 #introduction-inner { padding: 0; margin: 0; border: 0; }
.smartphone #content #introduction2 p{ line-height: 2; margin: 1rem auto 0; width: 72%; max-width: 400px; }
.smartphone #content #introduction2 p br{ display: none; }



#content .section .complete_btn_area { margin: 20px 0 0; }
#content .section .complete_btn_area .btns { margin-bottom: 30px; }
#content .section .complete_btn_area .btns .completeBtn { background-color: #e3497b; color: #fff; display: block; font-size: 14px; font-weight: bold; line-height: 1.4; padding: 10px 0; margin: 0 auto 10px; transition: opacity .4s ease; text-align: center; width: 600px; }
#content .section .complete_btn_area .btns .completeBtn:hover{ opacity: .8; color: #fff !important; }
#content .section .complete_btn_area .btns .completeBtn small { font-size: 11px; display: block; margin-bottom: 4px; }
#content .section .complete_btn_area .komes { color: #4c4948; margin-bottom: 15px; }
#content .section .complete_btn_area .complete_detail a { font-size: 12px; color: #e3497b; text-decoration: underline; }
#content .section .complete_btn_area .complete_detail a:hover { color: #e3497b !important; }
.smartphone #content .section .complete_btn_area .btns .completeBtn { max-width: 600px; width: 100%; }


#content #SIKZ { padding-top: 80px; margin: 110px 0 180px; }
#content #SIKZ:before { display: none; }
#content #SIKZ h2.title {}
#content #SIKZ h2.title * { text-align: center; }
#content #SIKZ h2.title .ttl_eyesduo { margin-bottom: 41px; }
#content #SIKZ h2.title .ttl_monthry { margin-bottom: 36px; }
#content #SIKZ h3.description { }
#content #SIKZ .img { padding-top: 72px; }
#content #SIKZ .price { padding-bottom: 71px; }
#content #SIKZ .tama { padding: 0; margin: 0 0 39px; }
#content #SIKZ .tama h5.tama_name { color: #333; font-size: 29px; letter-spacing: 0; }
#content #SIKZ .tama img { margin-bottom: 24px; }
#content #SIKZ .tama .attr { font-size: 13px; margin-bottom: 39px; }
#content #SIKZ .tama .attr li { margin-bottom: 10px; }
#content #SIKZ .tama .attr .lbl { font-weight: bold; }
#content #SIKZ .tama .attr .lbl:after { content: " : "; display: inline; }
#content #SIKZ .tama .attr .val {  }
#content #SIKZ .color { padding: 0; margin-bottom: 45px; }
#content #SIKZ .color img { margin-bottom: 19px; }
#content #SIKZ .color .attr { color: #666; font-size: 10px; }
#content #SIKZ .color .attr li { margin-bottom: 10px; }
#content #SIKZ .color .attr .lbl { display: block; text-decoration: underline; margin-bottom: 4px; }
#content #SIKZ .color .attr .val { display: block; }
#content #SIKZ .additional_informations { display: flex; justify-content: center; padding: 28px 0 22px; margin: 0 auto 46px; background: #fcf9f9; width: 560px; }
#content #SIKZ .additional_information { display: flex; flex-flow: column; justify-content: flex-end; padding: 0 20px 14px; }
#content #SIKZ .additional_information.flex { display: flex; flex-flow: row; }
#content #SIKZ .additional_information.flex > span { display: flex; flex-flow: column; padding: 0 5px; }
#content #SIKZ .additional_information img { margin: 0 auto; display: block; }
#content #SIKZ .additional_information p { margin-top: 11px; font-size: 10px; line-height: 1.6; color: #666; }
#content #SIKZ .additional_information a { color: inherit; text-decoration: underline; }
#content #SIKZ .detailBtn,
#content #SIKZ .cartBtn { width: 600px; font-size: 13px; margin: 0 auto 10px; }
.smartphone #content #SIKZ { margin: 0 -7.14% 70px; }
.smartphone #content #SIKZ h2.title .ttl_eyesduo img { max-width: 298px; width: 80%; }
.smartphone #content #SIKZ h2.title .ttl_monthry img { max-width: 510.02px; width: 95%; }
.smartphone #content #SIKZ h3.description { font-size: 18px; }
.smartphone #content #SIKZ .img { padding-top: 50px; }
.smartphone #content #SIKZ .img img { max-width: 516px; width: 95%; }
.smartphone #content #SIKZ .meta .title > strong { font-size: 20px; }
.smartphone #content #SIKZ .price { padding-bottom: 50px; }
.smartphone #content #SIKZ .attr { margin: 0 5%; }
.smartphone #content #SIKZ .attr .val span { display: inline-block; word-break:keep-all; }
.smartphone #content #SIKZ .additional_informations { flex-wrap: wrap; width: auto; max-width: 500px; padding: 28px 0 0;}
.smartphone #content #SIKZ .additional_information { padding-bottom: 30px; }
.smartphone #content #SIKZ .detailBtn,
.smartphone #content #SIKZ .cartBtn { max-width: 600px; width: auto; font-size: 14px; padding: 14px 0; }
.smartphone #content .section .complete_btn_area .complete_detail a { font-size: 14px; }



#content .complete_course_detail { width: 600px; margin: 0 auto; }
#content .complete_course_detail .ttl { font-size: 16px; color: #e3497b; border-bottom: 1px solid #fbe3eb; padding-bottom: 3px; margin-bottom: 20px; }
#content .complete_course_detail .secs { margin-bottom: 55px; }
#content .complete_course_detail .sec { color: #363636; margin-bottom: 26px; }
#content .complete_course_detail .sec .subttl { font-size: 12px; margin-bottom: 4px; color: #666; }
#content .complete_course_detail .sec .val { font-size: 15px; }
#content .complete_course_detail .sec .val small { font-size: 11px; }
#content .complete_course_detail .sec .val span { display: inline-block; word-break:keep-all; }
.smartphone #content .complete_course_detail { width: auto; }
.smartphone #content .complete_course_detail .sec .subttl { margin-bottom: 10px; }
.smartphone #content .complete_course_detail .sec .val { line-height: 1.8; }



#content #complete_course { margin-bottom: 100px; }
#content #complete_course:before { margin-bottom: 130px; }
#content #complete_course h2.title {}
#content #complete_course h2.title * { text-align: center; }
#content #complete_course h2.title .ttl_eyesduo { margin-bottom: 41px; }
#content #complete_course h2.title .ttl_monthry { font-size: 29px; color: #e3497b; }
#content #complete_course h3.description { font-size: 14px; margin-bottom: 87px; }
#content #complete_course .img  { padding: 0; margin-bottom: 58px; }
.smartphone #content #complete_course h2.title { margin-bottom: 20px; }
.smartphone #content #complete_course h2.title .ttl_eyesduo { margin-bottom: 30px; }
.smartphone #content #complete_course h2.title .ttl_eyesduo img { max-width: 298px; width: 80%; }
.smartphone #content #complete_course h2.title .ttl_monthry { font-size: 24px; }
.smartphone #content #complete_course h3.description { margin-bottom: 40px; }




#content #about_complete_course { margin-bottom: 190px; }
#content #about_complete_course:before { display: none; }
#content #about_complete_course #about_complete_course_inner { position: relative; padding: 74px 10px 75px; }
#content #about_complete_course #about_complete_course_inner:before,
#content #about_complete_course #about_complete_course_inner:after { display: block; content: ""; margin: 0; height: 40px; width: 100%; background: url('images/regular_deco.png') no-repeat center top; position: absolute; left: 0; }
#content #about_complete_course #about_complete_course_inner:before { top: 0; }
#content #about_complete_course #about_complete_course_inner:after { bottom: 0; transform: rotate(180deg); }
#content #about_complete_course h3.description { font-size: 20px; color: #e3497b; margin-bottom: 22px; }
#content #about_complete_course h4.text { font-size: 13px; line-height: 23px; font-weight: normal; margin-bottom: 50px; }
#content #about_complete_course h4.text span { display: inline-block; word-break:keep-all; }
#content #about_complete_course .points { display: flex; justify-content:center; margin-bottom: 60px; }
#content #about_complete_course .points .point { width: 250px; text-align: center; }
#content #about_complete_course .points .point .icon { text-align: center; }
#content #about_complete_course .points .point .img { padding: 17px 0 20px; }
#content #about_complete_course .points .point p { margin: 0 7px; color:#4c4948; font-size: 11.5px; line-height: 1.8; letter-spacing: 0; }
#content #about_complete_course .points .point:first-child p { text-align: center; }
#content #about_complete_course .points .point p small { font-size: 10px; }
#content #about_complete_course .cautions { margin-bottom: 0; }
#content #about_complete_course .caution { margin: 16px auto 0; width: 600px; }
#content #about_complete_course .caution .toggle__body { border: 1px solid #eee; background: #fafafa; }
#content #about_complete_course .caution .toggle__button--detail { font-size: 13px; font-weight: bold; color: #e3497b; padding: 14px 0; border-color: #fbe3eb; background: #fff7fa; }
#content #about_complete_course .caution .toggle__button--detail:after { }
#content #about_complete_course .caution .toggle__button.toggle__button--close { margin: 0 0 30px; }
#content #about_complete_course .caution .caution_inner { padding: 30px 20px; }
#content #about_complete_course .caution h3 { font-size: 13px; color: #e3497b; text-align: center; }
#content #about_complete_course .caution .ttl { font-size: 12px; color: #e3497b; text-align: center; margin: 40px 0 20px; }
#content #about_complete_course .caution ul { margin: 12px 0 20px; color: #555; }
#content #about_complete_course .caution ul li { font-size: 11px; text-indent: -1em; padding-left: 1em; margin-bottom: 9px; line-height: 1.8; }
#content #about_complete_course .caution ul li .kome { font-size: 10px; }
#content #about_complete_course .caution ul li a { color: inherit; text-decoration: underline; }
#content #about_complete_course .caution p.desc { font-size: 12px; line-height: 1.8; color: #555; text-align: center; margin-bottom: 10px; }
#content #about_complete_course .caution p.desc span { display: inline-block; word-break:keep-all; }
#content #about_complete_course .caution p.kome { padding-left: 12px; text-indent: -12px;  word-break: break-all; word-wrap: break-word; font-size: 11px; line-height: 1.7; }
#content #about_complete_course .caution p.contact { font-size: 11px; line-height: 1.8; color: #555; }
#content #about_complete_course .caution a.contact { font-size: 11px; text-decoration: underline; color: inherit; }
#content #about_complete_course .caution a.url { word-break: break-all; word-wrap: break-word; color: inherit; text-decoration: underline; }
#content #about_complete_course .caution .mypage { text-align: center; margin: 18px 0 20px; }
#content #about_complete_course .caution .mypage img { border: 1px solid #ddd; }
.smartphone #content #about_complete_course {  }
.smartphone #content #about_complete_course #about_complete_course_inner:before,
.smartphone #content #about_complete_course #about_complete_course_inner:after { background: url('images/sign_deco.png') no-repeat center top; background-size: cover; }
.smartphone #content #about_complete_course #about_complete_course_inner:before {}
.smartphone #content #about_complete_course #about_complete_course_inner:after {}
.smartphone #content #about_complete_course h3.description { font-size: 20px; line-height: 1.6; }
.smartphone #content #about_complete_course h3.description span { display: inline-block; word-break:keep-all; }
.smartphone #content #about_complete_course h4.text { margin-bottom: 40px; }
.smartphone #content #about_complete_course h4.text br { display: none; }
.smartphone #content #about_complete_course h4.text span { display: inline-block; font-size: 12px; }
.smartphone #content #about_complete_course .points { display: block; padding: 0; margin-bottom: 50px; }
.smartphone #content #about_complete_course .points .point { width: auto; margin-bottom: 25px; position: relative; }
.smartphone #content #about_complete_course .points .point .icon { position: absolute; top: 0; left: 35%; }
.smartphone #content #about_complete_course .points .point .body { display: flex; justify-content: space-between; }
.smartphone #content #about_complete_course .points .point .img { padding: 0; width: 30%; }
.smartphone #content #about_complete_course .points .point .img img { width: 100%; }
.smartphone #content #about_complete_course .points .point p { text-align: left; width: 65%; padding-top: 30px; font-size: 13px; }
.smartphone #content #about_complete_course .points .point:first-child p { text-align: left; }
.smartphone #content #about_complete_course .points .point p br { display: none; }
.smartphone #content #about_complete_course .points .point p small {}
.smartphone #content #about_complete_course .caution { margin: 10px 0 0; width: auto; }
.smartphone #content #about_complete_course .caution .toggle__body { }
.smartphone #content #about_complete_course .caution .toggle__button--detail { display: block; width: auto; padding: 36px 10px 10px; font-size: 13px; }
.smartphone #content #about_complete_course .caution .toggle__button--detail > span > span { display: inline-block; word-break:keep-all; }
.smartphone #content #about_complete_course .caution .toggle__button--detail > span:after { content: ""; background: url(images/icon_down.png) no-repeat center top; background-size: auto 12px; display: block; width: auto; height: 12px; margin-top: 10px; }
.smartphone #content #about_complete_course .caution .toggle__button--detail:after { display: none; }
.smartphone #content #about_complete_course .caution .toggle__button.toggle__button--close {}
.smartphone #content #about_complete_course .caution .toggle__buttons { margin: 0; }
.smartphone #content #about_complete_course .caution .toggle:checked ~ .toggle__buttons .toggle__button--detail { display: none; }
.smartphone #content #about_complete_course .caution .caution_inner { padding: 30px 20px 0; }
.smartphone #content #about_complete_course .caution .caution__buttons { margin-top: 50px; }
.smartphone #content #about_complete_course .caution p.desc { margin-bottom: 20px; }
.smartphone #content #about_complete_course .caution p.desc br { display: none; }
.smartphone #content #about_complete_course .caution .mypage img { max-width: 290px; width: 100%; }



#content #campaign { margin-bottom: 190px; }
#content #campaign:before { margin-bottom: 130px; }
#content #campaign h2.title {}
#content #campaign h2.title * { text-align: center; }
#content #campaign h2.title .ttl_eyesduo { margin-bottom: 41px; }
#content #campaign h2.title .ttl_monthry { font-size: 42px; color: #e3497b; letter-spacing: 0; margin-bottom: 20px; }
#content #campaign h3.description { font-size: 14px; line-height: 26px; margin-bottom: 57px; }
#content #campaign .img  { padding: 0; margin-bottom: 58px; }
#content #campaign .campaign_detail { }
#content #campaign .campaign_detail { width: 600px; margin: 0 auto; }
#content #campaign .campaign_detail .ttl { font-size: 16px; color: #e3497b; border-bottom: 1px solid #fbe3eb; padding-bottom: 3px; margin: 0 0 20px; }
#content #campaign .campaign_detail .secs { margin-bottom: 55px; }
#content #campaign .campaign_detail .sec { color: #363636; margin-bottom: 26px; }
#content #campaign .campaign_detail .sec .subttl { font-size: 17px; margin-bottom: 18px; color: #e3497b; line-height: 1.8; }
#content #campaign .campaign_detail .sec .subttl span { display: inline-block; word-break:keep-all; }
#content #campaign .campaign_detail .sec .val { font-size: 15px; }
#content #campaign .campaign_detail .sec .val small { font-size: 11px; }
#content #campaign .campaign_detail .sec .val span { display: inline-block; word-break:keep-all; }
#content #campaign .campaign_detail .sec .banner { margin: 28px 0; }
#content #campaign .campaign_detail .sec .overview { margin-bottom: 23px; font-size: 16px; text-decoration: underline; }
#content #campaign .campaign_detail .sec .detail { margin-bottom: 23px; font-size: 14px; line-height: 1.8; }
#content #campaign h3.description span,
#content #campaign .campaign_detail .sec .overview span,
#content #campaign .campaign_detail .sec .detail span { display: inline-block; word-break:keep-all; }
#content #campaign .campaignBtn { background-color: #e3497b; color: #fff; display: block; font-size: 13px; font-weight: bold; line-height: 1.4; padding: 10px 0; margin: 0 auto 10px; transition: opacity .4s ease; text-align: center; width: 600px; }
#content #campaign .campaignBtn:hover{ opacity: .8; color: #fff !important; }
.smartphone #content #campaign h2.title { margin-bottom: 20px; }
.smartphone #content #campaign h2.title .ttl_eyesduo { margin-bottom: 30px; }
.smartphone #content #campaign h2.title .ttl_eyesduo img { max-width: 298px; width: 80%; }
.smartphone #content #campaign h2.title .ttl_monthry { font-size: 40px; }
.smartphone #content #campaign h3.description { margin-bottom: 40px; }
.smartphone #content #campaign .campaign_detail { width: auto; }
.smartphone #content #campaign .campaign_detail .sec .banner img { max-width: 350px; width: 100%; }
.smartphone #content #campaign .campaign_detail .sec .subttl br { display: none; }
.smartphone #content #campaign .campaign_detail .sec .detail br { display: none; }
.smartphone #content #campaign .campaignBtn { max-width: 600px; width: auto; }



#content #all_colors { margin-bottom: 140px; }
#content #all_colors:before { margin-bottom: 130px; }
#content #all_colors h2.title {}
#content #all_colors h2.title * { text-align: center; }
#content #all_colors h2.title .ttl_eyesduo { margin-bottom: 41px; }
#content #all_colors h2.title .ttl_monthry { font-size: 29px; color: #e3497b; }
#content #all_colors h3.description { font-size: 14px; margin-bottom: 90px; }
#content #all_colors .img  { padding: 0; margin-bottom: 58px; }
#content #all_colors .colors { display: flex; flex-wrap: wrap; justify-content: space-between; }
#content #all_colors .colors > li { padding: 0 0 20px; position: relative; width: 33%; }
#content #all_colors .colors > li .color { color: #333; display: block; position: relative; }
#content #all_colors .colors > li .color__item { text-align: center; margin-bottom: 20px; }
#content #all_colors .colors > li .color__meta { padding: 0; position: relative; }
#content #all_colors .colors > li .color__meta > * { text-align: center; display: block; color: #363636; }
#content #all_colors .colors > li .color__date { margin: 0 0 12px; padding: 0; }
#content #all_colors .colors > li .color__date > span { display: block; margin-top: 5px; }
#content #all_colors .colors > li .color__date .release { font-size: 12px!important; text-decoration: underline; margin-bottom: 2px; display: block; text-align: center; margin: 0; padding: 0; line-height: 1.8;}
#content #all_colors .colors > li .color__date .reserve { font-size: 10px!important; display: block; text-align: center; margin: 0; padding: 0; line-height: 1.8;}
#content #all_colors .colors > li .color__name { margin: 0 0 12px; padding: 0; font-size: 16px; }
#content #all_colors .colors > li .attr { font-size: 11px; margin-bottom: 39px; }
#content #all_colors .colors > li .attr li { margin-bottom: 6px; text-align: center; }
#content #all_colors .colors > li .attr .lbl { font-weight: bold; }
#content #all_colors .colors > li .attr .lbl:after { content: " : "; display: inline; }
#content #all_colors .colors > li .attr .val {  }
.smartphone #content #all_colors h2.title { margin-bottom: 20px; }
.smartphone #content #all_colors h2.title .ttl_eyesduo { margin-bottom: 30px; }
.smartphone #content #all_colors h2.title .ttl_monthry { font-size: 24px; }
.smartphone #content #all_colors h3.description { margin-bottom: 70px; }
.smartphone #content #all_colors h3.description span { display: inline-block; word-break:keep-all; }
.smartphone #content #all_colors h2.title { margin-bottom: 20px; }
.smartphone #content #all_colors .colors > li { width: 50%; }
.smartphone #content #all_colors .colors > li .color__item img { max-width: 272px; width: 90%; }
.smartphone #content #all_colors .colors > li .color__date .release { font-size: 10px !important; }
.smartphone #content #all_colors .colors > li .color__name { font-size: 13px; font-weight: bold; letter-spacing: 0; }
.smartphone #content #all_colors .colors > li .attr li { margin-bottom: 10px; }
.smartphone #content #all_colors .colors > li .attr .lbl { display: inline-block; font-size: 9px; color: #666; text-align: center; border-bottom: 1px solid #ddd; padding: 2px 10px; margin-bottom: 4px; }
.smartphone #content #all_colors .colors > li .attr .lbl::after { display: none; }
.smartphone #content #all_colors .colors > li .attr .val { display: block; text-align: center; font-size: 10px; }
.smartphone #content #all_colors .colors > li .attr .val span { display: inline-block; word-break:keep-all; }




#content #colors_comment { background: #f8f8f8; padding: 20px 0; }
#content #colors_comment p { font-size: 11px; text-align: center; margin: 0; }
.smartphone #content #colors_comment { }
.smartphone #content #colors_comment p { text-align: left; padding-left: 1em; text-indent: -1em; margin: 0 1em 0 1.5em; }




#content #all_boxs { margin-bottom: 300px; padding: 0; }
#content #all_boxs:before { display: none; }
#content #all_boxs h2.title { margin: 0 0 73px; }
#content #all_boxs h2.title * { text-align: center; }
#content #all_boxs h2.title .ttl_monthry { font-size: 24px; color: #e3497b; }
#content #all_boxs .colors { display: flex; flex-wrap: wrap; justify-content: space-between; }
#content #all_boxs .colors > li { padding: 0 0 20px; position: relative; width: 160px; }
#content #all_boxs .colors > li .color { color: #333; display: block; position: relative; }
#content #all_boxs .colors > li .color__item { text-align: center; margin-bottom: 10px; }
#content #all_boxs .colors > li .color__meta { padding: 0; position: relative; }
#content #all_boxs .colors > li .color__meta > * { text-align: center; display: block; color: #363636; }
#content #all_boxs .colors > li .color__name { margin: 0; padding: 0; font-size: 12px; }
.smartphone #content #all_boxs h2.title { margin-bottom: 60px; }
.smartphone #content #all_boxs h2.title .ttl_monthry { font-size: 20px; }
.smartphone #content #all_boxs h3.title .ttl_monthry span { display: inline-block; word-break:keep-all; }
.smartphone #content #all_boxs .colors > li { width: 33%; }
.smartphone #content #all_boxs .colors > li img { width: 100%; }



/**
* resale
*/
#content header .resale {margin: 1em 0 2em; background: #fffafa; color: #8b202d; border: 1px solid #ece5e5; padding: 15px 17px 10px; }
#content header .resale span { }
#content header .resale .ttl {font-size: 13px; line-height: 1.7; margin-bottom: 7px; font-weight: bold;}
#content header .resale .txt {}
#content header .resale .txt p {font-size: 12px; line-height: 1.7; margin: 0; }
#content header .resale .txt strong {color: inherit; font-weight: bold; }
#content header .resale .txt a {color: inherit; text-decoration: underline; }
#content header .resale .kome {font-size: 11px; line-height: 1.6; padding-left: 1em; text-indent: -1em; margin-bottom: 3px; }
.smartphone #content header .resale {padding: 14px 15px; margin: 1em -5% 2em;}
.smartphone #content header .resale .ttl {font-size: 12px; }
.smartphone #content header .resale .txt {font-size: 12px; }
.smartphone #content header .resale .txt p { }
.smartphone #content header .resale .kome {font-size: 11px; }


#content .section .meta .resale { display: block; width: 500px; padding: 7px 10px; margin: 0 auto 20px; background: #fffafa; color: #8b202d; border: 1px solid #ece5e5; font-size: 11px; line-height: 1.8; }
#content .section .meta .resale span { display: inline-block; word-break:keep-all; }
.smartphone #content .section .meta .resale { width: auto; }
