@charset "UTF-8";

// COLOR
@black:#000;
@white:#FFF;
@gray:#999;
@grayD:#444;
@grayDD:#222;
@grayL:#bebebe;
@grayLL:#eee;
@grayLLL:#f5f5f5;

@gold:#b7923c;
@blue:#1A2859;
@red:#c04;

// LESS
@ncc:no-repeat center center;

// MIXIN
.trans{-webkit-transition:0.3s; -moz-transition:0.3s; -o-transition:0.3s; -ms-transition:0.3s; transition:0.3s;}
.fb{font-weight:bold;}
.tac{text-align:center;}
.tdn{text-decoration:none;}
.tdu{text-decoration:underline;}
.bgsc{-webkit-background-size:cover; -moz-background-size:cover; -o-background-size:cover; background-size:cover;}
.inline{display:-moz-inline-box; display:inline-block;}

/*BASE*/
html,body{height:100%; width:100%; margin:0;}
body{color:@black; line-height:1; -webkit-text-size-adjust:100%; background:@white;
font-family:"Noto Serif JP","游明朝体",YuMincho,"游明朝","Yu Mincho",Georgia,"Times New Roman","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","ヒラギノ明朝 Pro","Hiragino Mincho Pro","HG明朝E","ＭＳ Ｐ明朝","MS P明朝","MS PMincho","ＭＳ 明朝",serif;}
img{max-width:100%; height:auto; vertical-align:middle;}
/*CF*/
.cf:before,.cf:after{content:" ";display:table;}.cf:after{clear:both;}.cf{*zoom:1;}
/*LETTER*/
strong{.fb;}
.wf{font-family:"Crimson Text";}
.normalfont{font-family:"Helvetica Neue",Helvetica,"Droid Sans",Arial,Avenir,Verdana,"Hiragino Sans","ヒラギノ角ゴシック","游ゴシック Medium","YuGothic M","游ゴシック体","YuGothic","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","Meiryo UI","メイリオ",Meiryo,sans-serif;}
.attention{color:@red;}
.small{font-size:85%;}
.large{font-size:124%;}
.italic{font-style:italic;}
::selection{background:@gold; color:@white;}
::-moz-selection{background:@gold; color:@white;}

/*LINK*/
a:link{color:@gold; .tdu; .trans;}
a:visited{color:@gold; .tdu;}
a:hover{color:@grayD; .tdn;}
a:active{color:@gold; .tdn;}
a img{border:none; .tdn;}
a img:hover{opacity:0.6; .tdn;}

/*SP NAV*/
button#menubtn{z-index:9998; position:absolute; right:12px; top:12px; line-height:42px; height:42px; width:42px;}
button.btn{background-color:transparent; background:@white; color:@black; border:none; outline:none; cursor:pointer;}
button.btn:after{content: '\f0c9'; font-family:'fontello'; vertical-align:top; font-size:154%;}
button.active:after{content: '\e800'; font-family:'fontello'; line-height:42px; height:42px; width:42px; font-size:154%;}
button#menubtn.active{position:fixed;}
div#spnav{z-index:9997; display:none; position:fixed; top:0; width:100%; height:100%; background:rgba(0,0,0,0.9);
	nav{padding:62px 0 0;
		ul{font-size:124%; .tac; 
			li{width:25%; float:left; margin:0 auto 4%;
				i{font-size:154%;}
				a{display:block; padding:20px 0;}
				a:link{color:@white; .tdn; .trans;}
				a:visited{color:@white; .tdn;}
				a:hover{color:@gold; .tdn;}
				a:active{color:@white; .tdn;}
			}
			li:first-child{width:100%; margin:0 auto; float:none;}
			li:last-child{width:100%; margin:0 auto; float:none;
				a{width:116px; margin:0 auto;}
			}
		}
	}
}

/*HEADER*/
header{background:@black;
	h1{width:150px; margin:20px; float:left;}
}

/*LAYOUT*/
main{position:relative; clear:both; display:block; overflow:hidden;}

/*TITLE*/
div.pagetitle{margin:0 0 6%; background:url("../_img/bg/header.jpg") @ncc; .bgsc; .tac;
	h2{color:@white; font-size:200%; padding:10% 0; letter-spacing:2px; text-shadow:1px 1px 1px @black;}
}

/*PAGE*/
div.pagebody{padding:0 4%; margin:0 auto 8%;
	article{margin-bottom:6%;
		h3{font-size:139%; letter-spacing:1px; padding:20px 0 20px; margin:0 0 6%; border-bottom:1px solid @gray; border-top:1px solid @gray; line-height:1.5; .fb;}
		div.postbody>section{margin-bottom:6%;}
		div.postbody{word-wrap:break-word;
			img{margin-bottom:4%;}
			img.width50{max-width:50%; height:auto;}
			p{margin-bottom:4%; line-height:1.7;}
			h4{font-size:116%; line-height:1.7;  padding:0 0 2%; margin:0 0 4%; .fb; border-bottom:4px double @grayL;}
			table{width:100%; margin:0 0 4%;
				tr{width:100%; line-height:1.7;
					th{width:100%; display:block; background:@grayLL; padding:10px; text-align:left; .fb;}
					td{width:100%; display:block; padding:10px;}
				}
			}
			ul.imglist{
				li{float:left; width:32%; margin:0 2% 0.5% 0;}
				li:last-child{margin:0 0 0.5% 0;}
				li:first-child{width:49%;}
				li:nth-child(2){width:49%; margin:0 0 0.5% 0;}
			}
		}
		div.ceobox{background:@grayLL; padding:4%;
			img{width:60%; margin:0 auto 4%; display:block; border-radius:6px;}
			h4{font-size:124%; letter-spacing:1px; margin:0 auto 4%; .fb; .tac; }
			p{line-height:1.8;}
		}
	}
	article:last-child{margin-bottom:0;}
}
div.pagebody{
	article.aboutbox{
		h3{font-size:250%; font-weight:normal; border:none; padding:0; letter-spacing:3px; position:  relative; display:  inline-block;}
		h3:before{content:''; display:block; position:absolute; top:-4px; left:-12px; height:46px; width:46px; border-radius:50%; z-index:-1; background:#a0d8ef; opacity:0.5;}
		h3:after{content:''; display:block; width:100%; height:2px;  z-index:-1; background:#a0d8ef; opacity:0.7;}
		div.postbody{
			p{line-height:1.8; margin:0 0 4%;}
		}
	}	
}

/*FOOTER*/
footer{width:100%; padding:16px 0; background:@black; color:@white; line-height:1.8; .tac;
	a:link{color:@white; .tdn;}
	a:visited{color:@white; .tdn;}
	a:hover{color:@gold; .tdn;}
	a:active{color:@white; .tdn;}
	h1{width:40%; margin:0 auto 4%;}
	nav{
		ul{
			li{width:25%; float:left; margin:0 auto 2%;
				a{display:block;
					i{font-size:200%;}
				}
				a.linebtn{width:116px; margin:0 auto;}
			}
			li:first-child{width:100%; float:none; margin:0 auto 4%;}
			li:last-child{width:100%; float:none; font-size:139%; margin:0 auto 4%;}
		}
	}
	small{display:block; font-size:77%;}
}

/****************************************************/
/************************ PC ************************/
/****************************************************/
@media(min-width:769px){
html,body{min-width:1180px;}
.sp{display:none;}
.leftbox{padding-right:20px;}
.rightbox{padding-left:20px;}

/*HEADER*/
header{width:100%; padding:0 20px 20px;
	h1{width:200px; margin:18px 0 0;}
	nav{float:right; margin:15px 0 0;
		ul{
			li{float:left; margin:4px 12px 0 0;
				a{display:block;
					i{font-size:180%;}
				}
				a:link{color:@white; .tdn;}
				a:visited{color:@white; .tdn;}
				a:hover{color:@gold; .tdn;}
				a:active{color:@white; .tdn;}
			}
			li:first-child{margin:4px 12px 0 0;
				a{width:77.333px; margin:0 auto;}
			}
			li:last-child{margin:0;
				a{padding:10px; background:@gold; border-radius:4px;}
				a:link{color:@white; .tdn;}
				a:visited{color:@white; .tdn;}
				a:hover{color:@gold; .tdn; background:@white;}
				a:active{color:@white; .tdn;}
			}
		}
	}
}

/*TITLE*/
div.pagetitle{margin:0 0 60px;
	h2{font-size:400%; padding:10% 0; letter-spacing:5px;}
}

/*PAGE*/
div.pagebody{padding:0 5%; margin:0 auto 8%;
	article{margin-bottom:80px;
		h3{font-size:182%; letter-spacing:4px; padding:25px 0; margin:0 0 30px; .tac;}
		div.postbody>section{margin-bottom:60px;}
		div.postbody>section:last-child{margin-bottom:0;}
		div.postbody{
			img{margin-bottom:20px;}
			p{font-size:108%; margin-bottom:30px; line-height:1.8;}
			h4{font-size:131%; padding:0 0 10px; margin:0 0 20px; letter-spacing:2px;}
			table{margin:0 0 4%;
				tr{font-size:108%;
					th{width:auto; border:1px solid @grayL; display:table-cell; padding:15px; vertical-align:middle; letter-spacing:1px;}
					td{width:auto; border:1px solid @grayL; display:table-cell; padding:15px; vertical-align:middle;}
				}
			}
		}
		div.ceobox{
			img{width:100%; margin:0 auto;}
			h4{font-size:139%; letter-spacing:2px; text-align:left;}
			p{font-size:108%; line-height:2;}
		}
	}
	article:last-child{margin-bottom:0;}
}

div.pagebody{
	article.aboutbox{margin-bottom:60px;
		h3{font-size:350%; letter-spacing:5px; text-align:left;}
		h3:before{top:-25px; left:-30px; height:70px; width:70px;}
		div.postbody{
			p{font-size:116%; line-height:2.2; margin:0 0 2%;
				strong{font-size:116%; line-height:2;}
			}
		}
	}	
}

/*FOOTER*/
footer{width:100%; padding:16px 0; background:@black; color:@white; line-height:1.8; .tac;
	a:link{color:@white; .tdn;}
	a:visited{color:@white; .tdn;}
	a:hover{color:@gold; .tdn;}
	a:active{color:@white; .tdn;}
	section{width:50%; float:right;}
	h1{width:40%; margin:0 0 2%; float:right;}
	div.footphone{width:100%; clear:both; display:block; overflow:hidden; float:none; text-align:right; font-size:148%; .fb;
		span.small{font-size:80%;}
	}
	nav{width:50%; float:left;
		ul{
			li{float:left; width:auto; margin:0 12px 0 0;}
			li:first-child{width:auto; float:left; margin:4px 12px 0 0;}
			li:last-child{width:auto; float:left; margin:8px 0 0;}
		}
	}
	small{float:none; clear:both; overflow:hidden; font-size:93%;}
}

}
/************************ SP ************************/
@media (max-width:768px){
	.pc{display:none;}
	.spmb{margin-bottom:6%;}
}

/*-----------------------------------------------------
 6px = 46.1%    7px = 53.8%    8px = 61.5%    9px = 69.2%
10px = 77%     11px = 85%     12px = 93%     13px = 100%
14px = 108%    15px = 116%    16px = 123.1%  17px = 131%
18px = 138.5%  19px = 146.5%  20px = 153.9%  21px = 161.6%
22px = 167%    23px = 174%    24px = 182%    25px = 189%
26px = 197%
------------------------------------------------------*/