@charset "utf-8";

/*===============================================
common
===============================================*/

.sp_only { display:none;}
.pc_only { display:block;}

.full_width { width:100%; height:auto;}
strong,.bold { font-weight:bold!important;}

img { width:100%; height:auto; }
a img:hover { opacity:0.8;} 
a:hover {
    color: #023e12;
}

a.line { text-decoration:underline; color:#023e12;}

body{  font-family:"M PLUS 1p", "游ゴシック", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; color:#333;}
	
/*layout*/
.inr { width:1000px; margin:0 auto;}
.sec { padding:60px 0;}
.box { padding:20px; box-sizing:border-box;}
.sec_l { float:left;}
.sec_r { float:right;}
.txt_r { text-align:right;}
.txt_l { text-align:left;}
.indent { padding-left:1em; text-indent:-1em;}
.red { color:#cf005a;}
.center { text-align:center;}

section { margin:0; padding:0;}

/*===============================================
header
===============================================*/

.sec_title { text-align:center; font-weight:bold; font-size:min(5.2vw,26px); color:#000; margin-bottom:20px; border-bottom: 1px dashed #000; padding-bottom: 10px;}
.sec_subtitle {  font-weight:bold; font-size:18px; text-align:center;}
.page_title { background:#000; padding-top:130px; }
.page_title h2 { color:#FFF; padding-bottom:20px;}

/*===============================================
header
===============================================*/

header { position:fixed; z-index:2; top:0; width:100%; background:#fff; box-shadow:0 0 3px 1px #888;  }
header h1 { width:240px; margin:0 auto; padding:10px 0 10px 0;}
header .inr { position:relative;}

/*btn*/
header .btn { position:absolute; top:0px; right:0; width:200px;}

header nav ul { display: flex; justify-content: space-around; padding:3px 0 5px 0;}
header nav ul li a { font-weight:bold; font-size: min(3.2vw,16px);}

/*===============================================
sec00
===============================================*/

.sec00 { padding-top:150px; min-height: 400px; }
.sec00 img.imgChange { min-height: 400px; }
.sec00 figure {width:50vw; max-width: 600px; margin: 20px 0; }
.sec00 .inr { position:relative; color:#FFF; text-shadow:0 0 3px #000; }
.sec00 .inr .message { position:absolute; top:5vw; left:10px; width: 80%; }
.sec00 .inr .message h2 { font-size:min(2.5vw,2.2em); margin-bottom:10px; font-weight:bold;}
.sec00 .inr .message p { font-size:min(2.1vw,14px); line-height:2;}

@media screen and (max-width: 1000px) {
.sec00 .inr .message { }
}

@media screen and (max-width: 768px) {
.sec00 .inr .message { top: 20vw; }
.sec00 .inr .message p br { display:none;}

.sec00 figure {width:70vw; margin: 10px 0; }
.sec00 .inr .message h2 { font-size:min(4.2vw,2.2em); }
.sec00 .inr .message p { font-size:min(2.4vw,14px); line-height:1.8;}

}

/*===============================================
sec01
===============================================*/

.sec01 { }
.sec01 .col_sec { }
.sec01 .col_sec h4 { font-weight:bold; text-align:center; font-size:1.2em;}

/*===============================================
price
===============================================*/

.price li { margin-bottom:30px;}
.price li h3 { background:#f1f1f1; text-align:center; font-weight: bold; font-size:18px; padding:8px 0; margin-bottom:10px;}

.price .table_style { width:100%; text-align:center; }
.price .table_style dt { width:50%; background:#f9f9f9;}
.price .table_style dd { width:50%; }
.price .table_style dt,.price .table_style dd { border-bottom:1px #999999 solid; padding:5px 10px;}

/*===============================================
contact
===============================================*/

.contact .table_style { width:100%; text-align:center; }
.contact .table_style dt { width:30%;}
.contact .table_style dd { width:70%; text-align:left; }
.contact .table_style dt,.contact .table_style dd { border-bottom:1px #999999 solid; padding:15px 5px; box-sizing:content-box;}
.contact input[type=text],.contact textarea { width:95%; border:1px #999999 solid; font-size:13px; padding:0;  padding:10px 10px; box-sizing:border-box; box-sizing:content-box;}
.contact .validation_time { text-align:left;}

/*===============================================
access
===============================================*/

.access { background:#f9f9f9; text-align:center;}

/*===============================================
gallery
===============================================*/

.gallery ul { display: flex; flex-wrap: wrap;  justify-content: space-between;}
.gallery ul li { width: 48%;}


/*===============================================
footer
===============================================*/


footer { padding:30px 0; text-align:center; background:#000;}
footer dl { text-align:center; color:#FFF; }
footer dt { font-weight:bold; width:150px; margin:0 auto 10px auto;}
footer dd {font-size:12px;}
footer .copyright { font-size:10px; margin-top:40px;  color:#FFF;}
footer a,footer dd {color:#FFF!important;}
.page_top { position:fixed; bottom:40px; right:30px; width:90px; cursor:pointer; z-index:5;}


@media screen and (max-width: 768px) {
	
.sp_only { display:block;}
.pc_only { display:none;}

/*layout*/
.inr { width:100%; margin:0 auto; padding:0 2%; box-sizing:border-box; }
.sec { padding:40px 0;}
.message p { font-size:12px;}

/*header nav*/
header nav { display:none;}

.menu-trigger { display:block;}
.menu-trigger span { display: inline-block; transition: all .4s; box-sizing: border-box;}
.menu-trigger { position: relative; width: 36px; height: 29px;
}
.menu-trigger span { position: absolute;left: 0;width: 100%;height: 4px; background-color: #000; border-radius: 4px;}
.menu-trigger span:nth-of-type(1) { top: 0;}
.menu-trigger span:nth-of-type(2) { top: 12px;}
.menu-trigger span:nth-of-type(3) { bottom: 0;}
.menu-trigger.active span:nth-of-type(1) { -webkit-transform: translateY(11px) rotate(-45deg);transform: translateY(11px) rotate(-45deg);}
.menu-trigger.active span:nth-of-type(2) { opacity: 0;}
.menu-trigger.active span:nth-of-type(3) { -webkit-transform: translateY(-14px) rotate(45deg); transform: translateY(-14px) rotate(45deg);}
	
/*===============================================
title
===============================================*/

.sec_title { padding-top: 20px;   }
.sec_subtitle {}
.page_title { padding-top:60px; }
.page_title h2 { color:#FFF; padding-bottom:20px; font-size:18px;}

/*===============================================
header
===============================================*/

header { height:60px; border-top:4px #000 solid; }
header h1 { width:160px; max-width: 50%; padding-top:12px; }

header .sp_btn { position:absolute; right:10px; top:14px; }
header nav { top:50px; position:absolute; background:#fff; width:100%; left:0; margin:0; padding:0; box-sizing:border-box;}
header nav ul { display:block; width:100%; padding:0; text-align:center; }
header nav ul li { width:100%; border-bottom:1px #CCCCCC solid; padding:20px 0;}

/*===============================================
sec00
===============================================*/

.sec00 { padding-top:80px; }

/*===============================================
sec01
===============================================*/

.sec01 { }
.sec01 h3 + p { text-align:left; margin-top:5px;}
.sec01 .col_sec li { margin-bottom:20px; border-bottom:1px #CCCCCC solid; padding-bottom:10px;}
.sec01 .col_sec li:last-child {margin-bottom:0px;}
.sec01 .col_sec img { width:45%; float:left; }
.sec01 .col_sec div { width:50%; float:right; margin-top:-8px; }
.sec01 .col_sec h4 { text-align:left; }
.sec01 .col_sec div p { font-size:0.9em;}

/*===============================================
price
===============================================*/

.price li h3 { font-size:16px; padding:5px 0;}

/*===============================================
contact
===============================================*/

.contact .table_style { display:block; }
.contact .table_style dl { display:block; width:100%; box-sizing:border-box; margin:0; padding:0;}
.contact .table_style dt { display:block; width:100%; box-sizing:border-box; border-bottom:0; padding-bottom:0;}
.contact .table_style dd { display:block; width:100%; box-sizing:border-box;}

/*===============================================
gallery
===============================================*/



/*===============================================
footer
===============================================*/

footer { padding-bottom:80px;}
footer .foot_logo { width:100px; margin:30px auto 10px auto;}
footer dt { font-weight:bold; font-size:13px;}
footer dd {font-size:10px;}

.footer { font-size:10px; }

.page_top {  bottom:60px; right:10px; width:60px;}

/*===============================================
LINE
===============================================*/

.line_btn { background:url(../images/white_bg.png); padding:5px; box-sizing:border-box; position:fixed; bottom:0; left:0; z-index:10; height:60px; width:100%;}
.line_btn a { display:block; padding-top:10px; background:#13be13; height:100%; border-radius:5px; text-align:center; color:#FFF; font-weight:bold; font-size:15px; line-height:1.5; box-sizing:border-box; line-height:1; min-height:50px; }
.line_btn a { color:#FFF;}
.line_btn a span.icon { display:inline; position:relative; }
.line_btn a span.icon:before { color:#FFF; position:absolute; content:''; background:url(../images/icon_line.png) no-repeat; background-size:contain; width:50px; height:50px; left:-70px; top:-20px; margin:0px auto; bottom:-20px;}
.line_btn a:hover { text-decoration:none; background:#159b15;}	
}


