@charset "UTF-8";
html body{
color:#333;
font-family: 'Noto Sans JP', sans-serif;
letter-spacing: .02em;
background:#fff;
line-height: 1.6;
}

.note{
font-size: 11px;
line-height: 1.4!important; 
width: 800px;
margin: 100px auto 200px;
}
sup {
font-size: 70%; 
vertical-align: top;
position: relative;
top: -0.1em; 
}
.wei600{font-weight: 600!important;}
.layout{display: flex;
justify-content: space-between;}
.layout_y{display: flex;
justify-content: flex-start;
}
.f18{font-size: 18px}
.f16{font-size: 16px}
.f14{font-size: 14px}
.f12{font-size: 12px}
.fw{font-weight: bold}

/* PC*/
.pc{display: block;}
.sp{display: none;}
.pc_none{display: none !important;}
.sp_none{display: inline-block !important;}
.tr{text-align: right;}
.h3{text-align: center;}
.pane-footer{margin: 0}
.layout {
display: flex;
justify-content: space-between;
}
.ml20{margin-left: 20px;}
.mr20{margin-right: 20px;}
.mv{
margin: 0 auto;
padding-bottom: 100px;
max-width: 1920px;
max-height: 1206px;
overflow: hidden;
}
.mv img{
width: 100%;
}
.int h2{
margin: 86px auto 90px;
text-align: center;
}
.int h4{
font-size: 18px;
border-bottom: 1px solid #333;
font-weight: 600;
}
.int .layout{
width: 980px;
margin: 64px auto 0;
}
.int .layout div{
width: 45%;
}
.int p{
font-size: 16px;
margin: 10px auto 40px;
}
.one, .two, .three, .four{
position: relative
}
.one::after,.two::after,.three::after,.four::after{
position: absolute;
width: 41px;
height: 74px;
top: -20px;
left: -48px;
}
.one::after{
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/1.jpg);
}
.two::after{
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/2.jpg);
}
.three::after{
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/3.jpg);
}
.four::after{
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/4.jpg);
}

/* product */
.product{
padding-top: 220px;
width: 100%;
margin: 0 auto;
}
.blb_A{
width: 100%;
background: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/b_bg.jpg)no-repeat;
background-position: bottom left;
}
.blb_B{
width: 100%;
background: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/b_bg.jpg)no-repeat;
background-position: bottom right;
}
.item25 ,.item25_ {
width: 1100px;
height: 625px;
margin: 0 auto 148px;
background: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/b_bg.jpg)repeat-x;
background-position: bottom;

}
.itemimg{
width: 550px;
}
.mt130{
margin-top: 130px;
}
.mt100{
margin-top: 100px;
}
.inp{
font-size: 22px;
margin: 20px auto 80px;
line-height: 1.8;
}
.limited_{
width: 7em !important;
margin-left: 4px;
}
.limited,.limited_{
width: 8em;
background: #FFF;
font-size: 14px;
padding: 4px;
border: 1px solid #666;
text-align: center;
}
.limited_25{
width: 8em;
background: #FFF;
font-size: 14px;
padding: 4px;
border: 1px solid #66DBDB;
text-align: center;
color: #66DBDB;
}

.product h3{
font-size: 20px;
margin: 12px 0 8px;
font-weight: 600;
}
.product h3 span{
font-size: 14px;
}
.product .f14{
margin-top: 10px;
}
.color_ul ,.color_ul_{
font-size: 14px;
width: 430px;
}
.color_ul{
margin-bottom: 24px;
}
.color_ul_{
margin-bottom: 6px;
}
.color_ul li img,.color_ul_ li img{
margin-right: 6px;
}
.color{
margin-left: 6px;
}
.text{
width: 452px;
font-size: 16px;
margin-top: 12px;
}
.spng_btn a,.spng_btn25 a{
width: 350px;
margin: 20px auto 80px;
text-align: center;
display: block;
font-size: 20px;
padding: 10px 0;
font-weight: bold;
color: #FFF;
}
.spng_btn a{
background: #8DBAE6;
}
.spng_btn25 a{
background: #66DBDB;
}
.itemimg02,.itemimg03{
position: relative;
}
.itemimg02::after{
position: absolute;
width: 600px;
height: 497px;
bottom: 40px;
right: 0;
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/item02_.png);
}
.itemimg03::after{
position: absolute;
width: 762px;
height: 735px;
bottom: 40px;
left: 0;
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/item03.png);
}
.mt100{
margin-top: 100px;
}
/**.itemimg04::after{
position: absolute;
width: 744px;
height: 723px;
bottom: 40px;
right: 0;
content: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/item04_.png);
}**/


.LINEUP{
width: 960px;
margin: 0 auto;
padding: 134px 0 110px;
}
.LINEUP h2{
margin: 0 auto 90px;
text-align: center;
}
.LINEUP figure{
margin: 0 auto 90px;
}





/*1380以下*/
@media screen and (max-width: 1380px) {
}

/*960以下*/
@media screen and (max-width: 960px) {


}
/*780以下*/
@media screen and (max-width: 780px) {
#wrapper {   
    }	
html {
    overflow-x: hidden;
}
img{
    max-width: 100%;
}
.pc{
    display: none;
}
.sp{
    display: block;
}
.pc_none{
    display: block !important;
}	
.sp_none{
	display: none !important;
}
.sp_center{
    text-align: center!important;
}
.content{
background: #FFF;
}
.layout{display: block;}
.text_l{text-align: left!important}
/**/
.int ,.mv{
width: 100%;
}
.int{
padding-bottom: 30px;
}
.mv{
padding: 0;
}
.int h2 img {
margin: 44px auto 32px;
}

.slider_{
justify-content: center;
margin: 20px auto 0!important;
padding-bottom: 20px;
}
.mc-dots {
  margin: -14px auto; 
  padding: 0;
  text-align: center;
}
.mc-dots li {
  display: inline;
  margin: 0 4px;
}
.mc-dots li button {
  position: relative;
  text-indent: -9999px;
}
.mc-dots li button::before {
  background-image: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/off.png);
  background-repeat: no-repeat;
  background-size: contain;
  content: "";
  cursor: pointer;
  height: 10px;
  width: 10px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 14px;
}
.mc-dots li.slick-active button::before {
  background-image: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen24/on.png);
}
button {
  background: none;
  border: none;
  outline: none;
  padding: 0 7px;
}

.int h3, .int h2 {
font-size: 14px;
width: 80%;
margin: 0 auto;
}
.point div h4{
width: 240px;
margin: 0 auto;
}
.point div h4,.point div h5{
font-size: 14px;
font-weight: 600;
text-align: center;
}
.int p {
font-size: 12px;
text-align: left!important;
width: 300px;
margin: 10px auto 16px;
}

.item25, .item25_{
width: 100%;
height: 152vw;
background: none;
}
.blb_A{
width: 100%;
background: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/b_bgA.jpg)no-repeat;
background-position: top;
background-size: contain;
}
.blb_B{
width: 100%;
background: url(https://www.mimc.co.jp/img/usr/br/select_sunscreen25/b_bgB.jpg)no-repeat;
background-position: top;
background-size: contain;
}
.itemimg {
width: 90%;
margin: 0 auto;
}
.itemimg img{
margin: 0 auto;
}
.spinner{
width:90%;
margin: 0 auto;
}
.inp{
font-size: 16px;
padding-top: 30px;
margin: 0 auto 20px;
}

.itemimg02,.itemimg03,.itemimg04{
width: 100%;
background: none;
position: unset;
}
.limited_{
margin-top: 0;
}
.item04 .inp{
padding-top: 42px;
}
.item05 .inp{
margin-left: -10px;
}
.item04 h3{
padding-top: 230px;
}
.limited ,.limited_,.limited_25 {
font-size: 11px;
}
.product {
padding-top: 30px;
}
.product h3{
font-size: 14px;
margin: 6px auto 8px;
font-weight: 600;
}
.product h3 span{
font-size: 10px;
}
.product .f12,.product .f14{
font-size: 10px;
}
.product .f14{
margin-top: 14px;
}
.color_ul,.color_ul_{
font-size: 12px;
margin: 0 auto;
}
.color_ul li:first-child,.color_ul li:nth-child(3n),.color_ul_ li:first-child ,.color_ul_ li:nth-child(3n){
width: 16px;
margin-right: 4px;
}
.text{
width: 100%;
font-size: 14px;
margin-top: 12px;
}
.spng_btn a ,.spng_btn25 a{
width: 70%;
margin: 30px auto 60px;
font-size: 14px;
padding: 10px 0;
}
.mb70{
margin-bottom: 70px
}
.mt130{
margin-bottom: 20px;
}
.pt60{
padding-top: 60px
}
.LINEUP h2 {
margin: 0 auto 40px;
}
.LINEUP{
width: 90%;
margin: 0 auto;
padding: 0
}

.note{
width: 90%;
margin: 40px auto 0;
}

.itemimg02::after,.itemimg03::after,.itemimg04::after{
content:none;
}

}
/*430以下*/
@media screen and (max-width: 430px) {
.item03 .inp{
padding-top: 44px;
}

}
/*390以下*/
@media screen and (max-width: 390px) {

.item01 .limited {
margin-top: 174px;
}
.item03 .inp {
    padding-top: 42px;
}

}

.slick-slide img {
  text-align: center;
  margin: auto;
}