@charset "utf-8";


/* common */
.body			{ font-size:16px;}
.body>section	{ padding:90px 0 100px;} 
.tit			{ margin-bottom:2.5em; text-align:center; letter-spacing:-1px;}
.tit h2			{ margin:0; font-size:2em; color:#171717;}
.tit h2 span	{ color:#05559e;}
.tit h2::after	{ content:''; display:block; width:50px; height:1px; margin:0.2em auto 0.4em; background:#05559e;}
.tit p			{ margin:0; font-size:1.1em; font-weight:400; color:rgba(102,102,102,.8); word-break:keep-all;}



/* visual */
.visual					{ position:relative;}
.visual	.bg_area		{ height:660px;}
.visual li				{ position:relative; width:100%; height:660px;}
.visual .pc				{ position:absolute; width:2000px; left:50%; margin-left:-1000px;}
.visual .bx-controls-direction { display:none;}
.visual .bx-controls	{ position:absolute; bottom:55px; left:0; width:100%; text-align:center; z-index:100;}
.visual .bx-pager .bx-pager-item	{ display:inline; margin:0 2px;}
.visual .bx-pager .bx-pager-item a	{ display:inline-block; width:60px; height:5px; color:transparent; background:rgba(255,255,255,.5);}
.visual .bx-pager .bx-pager-item a.active { background:#05559e;}



/* product */
/* product>banner */
.product				{ background:url('/img/main/bg_product.jpg') no-repeat center; background-size:cover;}
.product .banner		{ overflow:hidden;}
.product .banner li		{ position:relative; float:left; width:23.5%; margin-right:2%; text-align:center;}
.product .banner li:nth-child(4) { margin-right:0;}
.product .banner li a:before		{ content:''; position:absolute; bottom:0; left:0; width:100%; height:8.3em; background:yellow;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;}
.product .banner li:nth-child(odd) a:before { background:#5d9834;}
.product .banner li:nth-child(even) a:before { background:#05559e;}

.product .banner li:nth-child(1) .thumb { background-image:url('/img/main/bg_feature01.jpg');}
.product .banner li:nth-child(2) .thumb { background-image:url('/img/main/bg_feature02.jpg');}
.product .banner li:nth-child(3) .thumb { background-image:url('/img/main/bg_feature03.jpg');}
.product .banner li:nth-child(4) .thumb { background-image:url('/img/main/bg_feature04.jpg');}
.product .banner li .thumb				{ width:100%; height:215px; background-size:cover; overflow:hidden; }
.product .banner li .thumb span			{ position:relative; display:block; padding-top:6.5em; width:100%; font-size:1.35em; font-weight:600; color:#fff; z-index:1;}
.product .banner li:nth-child(1) .thumb span { background:url('/img/main/icon_product01.svg') no-repeat center;}
.product .banner li:nth-child(2) .thumb span { background:url('/img/main/icon_product02.svg') no-repeat center;}
.product .banner li:nth-child(3) .thumb span { background:url('/img/main/icon_product03.svg') no-repeat center;}
.product .banner li:nth-child(4) .thumb span { background:url('/img/main/icon_product04.svg') no-repeat center;}
.product .banner li .thumb span.txt:after	 { content:''; display:block; width:0; height:1px; margin:0.5em auto 0; background:rgba(255,255,255,.5);
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;}

.product .banner li .desc					{ min-height:5em; padding:1.5em 12% 2em; font-weight:300; font-size:0.95em; line-height:1.3; color:#fff; word-break:keep-all;}
.product .banner li:nth-child(odd) .desc	{ background:#5d9834;}
.product .banner li:nth-child(even) .desc	{ background:#05559e;}
.product .banner li .desc p			{ position:relative; margin:0; z-index:1;
    -webkit-transition: all 0.3s linear;
    -moz-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;}

.product .banner li:hover a:before			{ height:100%;}
.product .banner li:hover .thumb span:after { width:75px;}
.product .banner li:hover .desc p			{ margin-top:-2.5em;}

/* product>link */
.product .link			{ margin-top:30px;} 
.product .link li		{ float:left; width:16.65%; padding-top:5em; text-align:center;  font-size:1.2em; font-weight:600; letter-spacing:-0.05em; border-right:1px solid rgba(0,0,0,.1); box-sizing:border-box;} 
.product .link li:last-child { border-right:0;}
.product .link li:nth-child(1) { background:url('/img/main/icon_feature01.png') no-repeat center 15px;}
.product .link li:nth-child(2) { background:url('/img/main/icon_feature02.png') no-repeat center 0px;}
.product .link li:nth-child(3) { background:url('/img/main/icon_feature03.png') no-repeat center 15px;}
.product .link li:nth-child(4) { background:url('/img/main/icon_feature04.png') no-repeat center 15px;}
.product .link li:nth-child(5) { background:url('/img/main/icon_feature05.png') no-repeat center 15px;}
.product .link li:nth-child(6) { background:url('/img/main/icon_feature06.png') no-repeat center 15px;}
.product .link li:nth-child(odd) { color:#5d9834;}
.product .link li:nth-child(even) { color:#05559e;}




/* contruct_ex */
.contruct_ex			{ background:#fbfbfb;}
.contruct_ex .bx-viewport { height:auto !important;}
.contruct_ex .bx-controls-direction a {  top:45%; z-index:100; width:26px; height:52px; color:transparent; }
.contruct_ex .bx-controls-direction .bx-prev { position:absolute; left:-60px;}
.contruct_ex .bx-controls-direction .bx-prev::before { content:''; position:absolute; left:0; top:0; width:2px; height:35px; background:#a7a7a7; transform:rotate(45deg)}
.contruct_ex .bx-controls-direction .bx-prev::after { content:''; position:absolute; left:0; bottom:-7px; width:2px; height:35px; background:#a7a7a7; transform:rotate(135deg)}
.contruct_ex .bx-controls-direction .bx-next { position:absolute; right:-60px;}
.contruct_ex .bx-controls-direction .bx-next::before { content:''; position:absolute; right:0; top:0; width:2px; height:35px; background:#a7a7a7; transform:rotate(135deg)}
.contruct_ex .bx-controls-direction .bx-next::after { content:''; position:absolute; right:0; bottom:-7px; width:2px; height:35px; background:#a7a7a7; transform:rotate(45deg)}

.contruct_ex dl				{ float:left; width:32%; margin-right:2%; }
.contruct_ex dl:last-child	{ margin-right:0;}
.contruct_ex dl .img		{ overflow:hidden;}
.contruct_ex dl .img img	{ width:100%; height:auto; vertical-align:top; transition:all .4s;}
.contruct_ex dl:hover .img img { transform:scale(1.1); }
.contruct_ex dl .text		{ margin-left:0; padding:1em; text-align:center; background:#fff url('/img/main/bg_plus.jpg') no-repeat right bottom; border:1px solid #ededed;}
.contruct_ex dl .text h5	{ margin:0; font-size:1.2em;}
.contruct_ex dl .text h5 a	{ color:#000; font-weight:500;}
.contruct_ex dl .text p		{ margin:0.3em auto 1.3em; font-weight:300; line-height:1.4; letter-spacing:-1px; word-break:keep-all;}
.contruct_ex dl .text p	a	{ color:#4c4c4c;}




/* info */
.info .center,
.info .board,
.info .promotion{ float:left; width:49%; box-sizing:border-box;}

/* info>center */
.info .center { height:550px; margin-right:2%; color:#fff; background:url('/img/main/bg_center.jpg'); background-size:cover;}
.info .center .text { padding:2.8em 5% 2em 35%; border-bottom:1px solid rgba(255,255,255,.2); box-sizing:border-box; background:url('/img/main/bg_center.png') no-repeat 20% 60%;}
.center .text strong { font-size:1.5em;}
.center .text p { margin:0.5em 0 0; font-weight:100; font-size:0.95em; color:rgba(255,255,255,.8); line-height:1.4;}
.center .map	{ padding:7% 12%; background:url('/img/main/img_map.png') no-repeat 85% center; box-sizing:border-box;}
.center dl		{ margin:0;}
.center dl dd	{ margin-left:0;}
.center .main dt{ padding-left:20px; font-weight:600; font-size:1.05em; background:url('/img/main/icon_map.png') no-repeat left center;}
.center .main .call { margin:0.3em 0 0.1em; font-size:1.6em; font-weight:600;}
.center .main .phone,
.center .main .mail { font-weight:300; font-size:1.1em; letter-spacing:0; line-height:1.3;}
.center .branch		{ display:inline-block; margin-top:1em; padding-top:1em; border-top:1px solid rgba(255,255,255,.4);}
.center .branch dt,
.center .branch dd	{ float:left; line-height:1.6;}
.center .branch dt	{ clear:both; font-weight:600; font-size:1.1em;}
.center .branch dd	{ margin-left:0.5em; font-size:1.1em; letter-spacing:0; font-weight:300;}

/* info>board */
.info .board dl		{ float:left; width:49%; margin:0; padding:7% 4%; border:3px solid #f1f1f1; box-sizing:border-box;}
.info .board dl:first-child { margin-right:2%;}
.info .board dl:hover { border:3px solid #05559e; background:url('/img/main/btn_link.jpg') no-repeat right bottom;}
.info .board dl dt a { font-weight:600; font-size:1.1em; color:#000; letter-spacing:-0.05em; line-height:1.3; word-break:keep-all;}
.info .board dl dd	 { margin-left:0; }
.info .board dl dd a { font-weight:300; color:#6d7173; letter-spacing:-0.08em; line-height:1.4; word-break:keep-all;}
.info .board dl dd .date { margin:0; font-weight:300; font-size:0.9em; letter-spacing:0;}

/* info>promotion */
.info					{ overflow:hidden;}
.info .promotion		{ margin-top:1%; padding:4% 0; background:#eaeff2;}
.info .promotion>div	{ float:left; width:50%; padding-left:22%; box-sizing:border-box;}
.info .promotion>div:first-child { border-right:1px solid #c2d0db;}
.info .promotion .certification { background:url('/img/main/icon_certification.png') no-repeat 15% center;} 
.info .promotion .book	{ background:url('/img/main/icon_book.png') no-repeat 15% center;} 
.info .promotion h3		{ margin:0; }
.info .promotion p		{ margin:0.2em 0 0.7em; line-height:1.4; color:#666; letter-spacing:-0.05em;}
.info .promotion a		{ padding-right:2.3em; color:#05559e; font-size:0.9em; font-weight:500; background:url('/img/main/bg_link.png') no-repeat right center;}





/*¹ÝÀÀÇü½ÃÀÛ*/

@media only all and (max-width : 1200px) {
	/* common */
	.body			{ font-size:15px;}

	/* product */
	.product .banner li .desc					{ min-height:9em;}
	.product .banner li a:before				{ display:none;}
	.product .banner li:hover .thumb span:after { width:0;}
	.product .banner li:hover .desc p			{ margin-top:auto;}

	/* contruct_ex */
	.contruct_ex .bx-controls-direction .bx-prev { left:-20px;}
	.contruct_ex .bx-controls-direction .bx-next { right:-20px;}
	.contruct_ex .bx-controls-direction .bx-prev::before,
	.contruct_ex .bx-controls-direction .bx-next::before { height:20px;}
	.contruct_ex .bx-controls-direction .bx-prev::after,
	.contruct_ex .bx-controls-direction .bx-next::after { height:20px; bottom:18px;}

	/* info */
	.info .center, .info .board, .info .promotion { float:none; width:100%;}
	.info .board	 { margin:1em 0; overflow:hidden;}
	.info .promotion { clear:both; overflow:hidden;}
}


@media only all and (max-width : 900px) {
	/* common */
	.body			{ font-size:15px;}
	.tit p br		{ display:none;}

	/* Visual */
	.visual .bx-viewport		{ height:65vw !important;}
	.visual .bx-controls		{ bottom:35px;}

	/* product */
	.product .banner li:hover .thumb span:after { width:0;}
	.product .banner li:hover .desc p			{ margin-top:auto;}
	.product .banner li							{ width:49%; margin-top:1em;}
	.product .banner li:nth-child(even)			{ margin-right:0;}
	.product .banner li .desc					{ min-height:5em;}
	.product .link li	{ width:33.3%;}
	.product .link li:nth-child(3n) { border-right:0;}


	.gallery.inner { width:90%;}

}




@media only all and (max-width : 600px) {
	/* common */
	.body			{ font-size:13.5px;}
	.body>section	{ padding:5em 0;}

	/* Visual */
	.visual .bx-viewport		{ height:68vw !important;}
	.visual .bx-controls		{ bottom:15px;}
	.visual .bx-pager .bx-pager-item a { width:40px;}

	/* product */
	.product .link li	{ width:50%; padding-top:3.5em; background-size:3em !important;}
	.product .link li:nth-child(odd) { border-right:1px solid rgba(0,0,0,.1);}
	.product .link li:nth-child(even) { border-right:0;}
	.product .banner li .thumb		{ height:auto; padding-bottom:1em;}
	.product .banner li .thumb span	{ padding-top:4.5em; background-size:20% !important;}
	.product .banner li .desc { padding-bottom:0; min-height:9em;}

	/* info */
	.info .center			{ height:auto;}
	.info .center .text		{ padding-left:30%; background:url('/img/main/bg_center.png') no-repeat 14% 50%; background-size:15%;}
	.center .branch dt,
	.center .branch dd		{ font-size:0.95em;}
	.center .map			{ padding:8% 5%; background-size:30%; }

	.info .promotion>div	{ padding-left:5%;}
	.info .board dl:hover	{ border:3px solid #05559e; background:none;}
	.info .board dl dd a	{ font-size:0.9em; line-height:1.3;}
	.info .promotion .certification { background-position:90% 80%; background-size:25%;}
	.info .promotion .book  { background-position:90% 80%; background-size:25%;}
	.info .promotion p		{ font-size:0.85em;}

	.gallery.inner { width:80%;}
	.contruct_ex dl .text { background-size:10%;}
}
