@import (once) "font.less";
@import (once) "default.less";


/* list ///////////////////////*/
.list{
padding:75px 0 0 0;
}
.list:nth-of-type(4){
padding:0;
}


@media (max-width:550px){
.list{
padding:60px 0 0 0;
}
}


/* contents ///////////////////////*/
.contents{

.read{
padding:15px 0 30px 0;
}

}


/* detail ///////////////////////*/
.detail{

article{
.dt;
}
section{
.dtc;
.vat;
}
section:nth-of-type(1){
width:800px;
padding:0 3vw 0 0;
}
section:nth-of-type(2){
width:300px;
}

}


@media (max-width:1050px){
.detail{

article{
.db;
}
section{
.db;
}
section:nth-of-type(1){
width:100%;
padding:0;
}
section:nth-of-type(2){
width:100%;
}

}
}



/* main ///////////////////////*/
.main{
.image{
width:100%;
}
.photo{
padding-top:60%;
}

}


/* main_teiki ///////////////////////*/
.main_teiki{
background:@c1;
padding:15px;
color:#FFF;


ul{
.dt;
width:100%;
}
li{
.dtc;
}

.h3{
font-size:120%;
}
.h2{
font-size:150%;
}
.h1{

}

p,
strong{
.ffgb;
.db;
.tac;
}
p{
.nw;
}
small{
font-size:14pt;
.nw;
}

.text1{
padding:15px 0;

strong{
font-size:150%;
text-decoration: line-through;
}
}

.text2{
padding:15px 0;
background:@orange;

strong{
font-size:200%;
}
}

}



/* gaiyou ///////////////////////*/
.gaiyou{
padding:15px 0 0 0;

li{
.pr;
border-bottom:1px @g5 solid;
padding:10px 0 10px 70px;
line-height:140%;
}

p{
.pa;
margin-left:-70px;
.fwn;
}
li:nth-child(1){
.bold;
}

.price{
.tar;
padding:30px 0 0 0;
}
.price em{
.ffgb;
font-size:23pt;
padding:0 0 0 15px;
}

}


@media (max-width:850px){
.gaiyou{

li{
padding:10px 0 10px 60px;
}

p{
margin-left:-60px;
}
li:nth-child(1){
.bold;
}

}
}


/* outline ///////////////////////*/
.outline{
padding:75px 0 0 0;

}

@media (max-width:850px){
.outline{
padding:45px 0 0 0;

}
}


/* ajiwai ///////////////////////*/
.ajiwai{
padding:75px 0 0 0;

dl{
.dt;
width:100%;
}
dd{
.dtc;
.vat;
}
dd:first-child{
width:50%;
}

.wrap{
width:100%;
padding:15px;
background:@c6;
}
.image{
background-size:cover;
}

table{
.center;
}
td:nth-child(1){
.nw;
width:60px;
letter-spacing:.5em;
}
p{
.db;
width:170px;
height:30px;
background:url("../image/icon_mame3.svg") repeat-x 0 0;
}
b{
.db;
height:30px;
background:url("../image/icon_mame2.svg") repeat-x 0 0;
}
.m0{
width:0;
}
.m1{
width:35px;
}
.m2{
width:70px;
}
.m3{
width:100px;
}
.m4{
width:135px;
}
.m5{
width:170px;
}



}


@media (max-width:850px){
.ajiwai{
padding:45px 0 0 0;

.wrap{
width:100%;
}

.text{
padding:15px 0;
}

}
}

@media (max-width:550px){
.ajiwai{

dl{
.db;
}
dd{
.db;
}
dd:first-child{
height:55vw;
width:100%;
}

}
}


/* baisen ///////////////////////*/
.baisen{
padding:75px 0 0 0;

.wrap{
border-top:3px @c1 solid;
border-bottom:3px @c1 solid;
}

table{
width:100%;
}
tr{
border-bottom:2px @g6 solid;
}
tr:last-child{
border:0;
}
th, td{
.pr;
.tac;
}
th:nth-of-type(1){
width:150px;
img{
width:100%;
}
}
td:nth-of-type(1){
width:60px;
background:@c6;
}

.master{
background:@orange !important;
color:#FFFF;
}
.master:before{
content:"";
.pa;
.db;
width:135px;
height:110px;
background:url("../image/detail_master.png") no-repeat 0 0;
bottom:0;
left:250px;
}

}


@media (max-width:650px){
.baisen{
padding:45px 0 0 0;

.master:before{
.dn;
}

}
}



/* hiki ///////////////////////*/
.hiki{
padding:60px 0 0 0;

.wrap{
padding:15px;
background:@c6;
}

dl{
.dt;
width:100%;
}
dd{
.dtc;
.vat;
padding:15px;
width:33.3%;
}

.photo{
padding-top:30%;
}

ul{
padding:15px 0 0 0;
}
li:before{
content:"";
.dib;
.vam;
margin:0 5px;
width:6px;
height:6px;
.r(50%);
background:@c1;
}

em{
.db;
.bold;
.tac;
padding:0 0 5px 0;
}

}


@media (max-width:850px){
.hiki{
padding:45px 0 0 0;

dd{
padding:5px;
}

}
}


@media (max-width:650px){
.hiki{

dl{
.db;
width:100%;
}
dd{
.db;
padding:0 0 15px 0;
width:100%;
}

.photo{
padding-top:20%;
}

}
}


/* drip ///////////////////////*/
.drip{
padding:15px 0 0 0;

dl{
.dt;
}
dd{
.dtc;
.vat;
}
dd:first-child{
width:350px;
padding:0 30px 0 0;
}
.photo{
padding-top:60%;
}

}

@media (max-width:650px){
.drip{
padding:0;

dl{
.db;
}
dd{
.db;
}
dd:first-child{
width:100%;
padding:0 0 15px 0;
}

}
}


/* haisou ///////////////////////*/
.haisou{
padding:75px 0 0 0;

.wrap{
border:3px @c1 solid;
background:@c7;
}

dl{
.dt;
width:100%;
padding:15px;
}
dd{
.dtc;
.vat;
padding:0 15px 15px 15px;
width:50%;
}

h5{
.ffgb;
font-size:17pt;
line-height:100%;
}

em{
.db;
padding:15px;
background:#FFF;
border:3px @c6 solid;
}

table{
width:100%;
}
td{
padding:0;
}
li{
padding:0 0 0 1em;
}


li:before{
content:"※";
.dib;
margin-left:-1em;
}

}


@media (max-width:850px){
.haisou{
padding:60px 0 0 0;

dl{
.db;
}
dd{
.db;
padding:0;
width:100%;
}
dd:last-child{
padding:30px 0 0 0;
}

}
}



/* qa ///////////////////////*/
.qa{
padding:75px 0 0 0;

dt{
.pr;
.bold;
padding:15px 0 0 20px;
}
dd{
padding:0 0 15px 30px;
border-bottom:2px @c5 solid;
}

dt:before{
content:"";
.pa;
.db;
background:@c1;
width:5px;
height:5px;
top:28px;
left:5px;
}

}


@media (max-width:850px){
.qa{
padding:60px 0 0 0;

}
}


/* fixed ///////////////////////*/
#fixed{
width:300px;
}

@media (max-width:1050px){
#fixed{
width:100%;
}
}


/* form ///////////////////////*/
.form{

h3{
.pr;
.tac;
.ffgb;
color:#FFF;
font-size:120%;
padding:15px 0;
background: @orange;
}

.wrap{
width:100%;
border:3px @orange solid;
background:#FFF;
.oh;
}
.area{
width:150%;
margin-left:-25%;
}

.info{
padding:30px 30px 0 30px;
}
.image{
.center;
max-width:300px;
}
.photo{
padding-top:60%;
}
.price{
.ffgb;
.tac;
em{
padding:0 0 0 10px;
}
}
}


@media (max-width:1050px){
.form{
.pf;
bottom:0;
left:0;
width:100%;
padding:3vw;
background: rgba(255,255,255,.9);
z-index:9999;

h3{
padding:15px 0;
font-size:140%;
cursor:pointer;
.r(5px);
z-index:10000;
background: @red;
}

.open span{
.dn;
}
.open:before{
content:"とじる";
.db;
}

.modal{
.pf;
.dn;
top:0;
left:0;
width:100%;
height:100%;
z-index:9999;
background: rgba(255,255,255,.9);
}
.jc{
width:100%;
height:100%;
padding:0 0 60px 0;
}
.wrap{
width:90%;
}

}
}