@charset "utf-8";


@font-face {
    font-family:'fontello';
  	src: url('fontello.eot?30918419');
    src: url('fontello.eot?30918419#iefix') format('embedded-opentype'),
       url('fontello.woff?30918419') format('woff'),
       url('fontello.ttf?30918419') format('truetype');
}

 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
  width: 1em;
  text-align: center;

}
 
.icon-print:before { content: '\e817'; }
.icon-twitter-rect:before { content: '\e809'; } /* '' */
.icon-down-open:before { content: '\e816'; } /* '' */
.icon-left-open:before { content: '\e815'; } /* '' */
.icon-right-open:before { content: '\e814'; } /* '' */
.icon-up-open:before { content: '\e813'; } /* '' */
.icon-angle-left:before { content: '\e800'; } /* '' */
.icon-angle-right:before { content: '\e801'; } /* '' */
.icon-angle-up:before { content: '\e802'; } /* '' */
.icon-angle-down:before { content: '\e803'; } /* '' */
.icon-facebook-squared:before { content: '\e804'; } /* '' */
.icon-tumblr-squared:before { content: '\e805'; } /* '' */
.icon-menu:before { content: '\e807'; } /* '' */
.icon-youtube-squared:before { content: '\e806'; } /* '' */
.icon-cancel-circle:before { content: '\e812'; } /* '' */
.icon-download:before { content: '\e80d'; } /* '' */
.icon-pencil:before { content: '\e811'; } /* '' */
.icon-edit:before { content: '\e80a'; } /* '' */
.icon-chat:before { content: '\e810'; } /* '' */
.icon-attention:before { content: '\e80e'; } /* '' */
.icon-question:before { content: '\e80f'; } /* '' */
.icon-popup:before { content: '\e80c'; } /* '' */
.icon-facebook-rect:before { content: '\e80b'; } /* '' */
.icon-twitter-squared:before { content: '\e808'; } /* '' */


/** 
    
	 
	Settings	 

	 
			  **/
			  

*{
	background-repeat:no-repeat;
	line-height:140%;
	font-family:"ヒラギノ角ゴ Pro W3", Hiragino Kaku Gothic Pro, "メイリオ", Meiryo,  "ＭＳ Ｐゴシック", sans-serif;
	margin:0;
	padding:0;
}

a {text-decoration:none; overflow:hidden; color:#06C}
a:hover {color:#FF9900}

img {border: none; line-height:0; vertical-align:bottom}

.clear{clear:both; height:0; line-height:0; font-size:0}

.space10 {height: 10px}
.space20 {height: 20px}
.space30 {height: 30px}
.space40 {height: 40px}
.space100 {height: 100px}

.mt5{margin-top:5px}
.mt10{margin-top:10px}
.mt20{margin-top:20px}
.mt30{margin-top:30px}
.mt40{margin-top:40px}
.mt50{margin-top:50px}

.mb5{margin-bottom:5px}
.mb10{margin-bottom:10px}
.mb20{margin-bottom:20px}
.mb30{margin-bottom:30px}
.mb40{margin-bottom:40px}
.mb50{margin-bottom:50px}

.ml10{margin-left:5px}
.ml10{margin-left:10px}
.ml20{margin-left:20px}
.ml30{margin-left:30px}
.ml40{margin-left:40px}
.ml50{margin-left:50px}

.mr10{margin-right:5px}
.mr10{margin-right:10px}
.mr20{margin-right:20px}
.mr30{margin-right:30px}
.mr40{margin-right:40px}
.mr50{margin-right:50px}

.font10{font-size:10px}
.font12{font-size:12px}
.font14{font-size:14px}

.bold{font-weight:bold}

.txt-left{text-align:left}
.txt-center{text-align:center}
.txt-right{text-align:right}

.red{color:#C00}

.left {float:left}
.center{float:left}
.right {float:right}

p{line-height:160%}

li{list-style: none;}

a:hover img{
	filter: alpha(opacity=70);
	-moz-opacity:0.75;
	opacity:0.75;
}
a img{
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.alpha:hover{
	filter: alpha(opacity=70);
	-moz-opacity:0.75;
	opacity:0.75;
}

.transition{ 
	text-decoration:none;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}

.r-corner{
	-webkit-border-radius: 10px;
	-moz-border-radius:10px;
	border-radius:10px;
}

.cursor{cursor:pointer; cursor:hand}

th,td{text-align:left}



/** Back to Top **/ 

#back-top {
	position: fixed;
	bottom: 80px;
	right:30px;
	z-index:9999;
	display:none
}
#back-top img{
	width:50px;
	height:auto
}
.no-alpha a:hover{
	filter: alpha(opacity=100);
	-moz-opacity:1;
	opacity:1;
}



.clearfix:after {
  content: "."; 
  display: block; 
  height: 0; 
  clear: both; 
  visibility: hidden;
}

.clearfix { display: inline-table; }
.clearfix{zoom:1}/** for IE7 **/

/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */

.table-style-01{width:100%}
.table-style-01 table{width:100%;border-collapse:separate;border-spacing:1px;}
.table-style-01 th{padding:10px; text-align:right;}
.table-style-01 td{padding:10px;}


.table-style-02{width:100%;background-color:#ccc}
.table-style-02 table{width:100%;border-collapse:separate;border-spacing:1px;}
.table-style-02 th{text-align:right; padding:8px 10px; vertical-align:top; white-space:nowrap;background:#eee}
.table-style-02 td{ padding:8px 10px; background-color:#fff}


body{-webkit-text-size-adjust: 100%;  font-size:14px; height:100%; background-color:#f5f5f5; border-bottom:solid 5px #002040} 
#wrapper{height:100%; margin:0 auto; border-left:1px solid #ddd;border-right:1px solid #ddd;}
.inner{max-width:1280px; margin:0 auto; position:relative}


/** Header **/
#top-box{background-color:#333;color:#eee; font-size:13px; text-align:right; padding:3px 20px 3px 0 }
header {background-color:#002040;}
header div.left{width:25%;background-color:#002040; height:150px; text-align:right}
header div.right{width:75%;background-color:#fff; height:150px; position:relative}
header h1{color:#eee; font-size:12px; font-weight:normal; margin-top:20px; margin-right:20px}
header h2{margin-top:15px; margin-right:40px}
header h2 img{max-width:200px; width:100%; height:auto}


#gnavi{margin-top:60px;padding-left:100px}
#gnavi li{float:left; font-size:14px;margin:0 0 0 15px}
#gnavi li a{color:#333;}
#gnavi li a:hover{color:#ccc}
#gnavi li:after {content: "/"; color:#999; margin-left:15px}

#news-box{background-color:#eee; padding:5px 0; position:absolute; bottom:0; left:0; z-index:2; width:100%}
#news-box p{margin-left:40px}
#news-box span{font-size:12px; font-weight:bold}


/**

TOP

**/


#hd_img{position:absolute; top:0; left:0; z-index:5}

#slider-box{  position:relative;height:532px; overflow:hidden}
#slider-box li{background-size:cover; height:532px; background-position:center center; width:100%;float:left; position:relative; text-align:center}
#slide-text-01{position:absolute; top:50%; left:50%; margin-top:-46px; margin-left:-472px; z-index:3; display:none}
#slide-text-02{position:absolute; top:50%; left:50%; margin-top:-46px; margin-left:-421px; z-index:3; display:none}




#top-sec-01{text-align:center;background-image:url(../images/catch-bg.jpg); background-size:cover; height:256px}
#top-sec-01 h3{font-size:24px; color:#FF7F00; padding:50px 0; font-weight:normal; font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif}
#top-sec-01 p{color:#eee; font-size:16px;line-height:200%}


#top-sec-02{background-color:#eee}
#top-sec-02 div.inner{min-height:300px; padding:50px 0}

h3.title{font-size:24px}
h3.title span{font-size:14px; padding-left:20px; margin-left:20px; font-weight:normal; border-left:solid 1px #ccc}
h3.title span a{border-bottom:dotted 1px #06C}

#items{margin-top:50px}
#items li{float:left; width:33%}
#items li a{display:block; color:#333; text-align:center; background-color:#fff; padding:15px; margin:0 20px 20px 0; border:solid 3px #fff;
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;}
#items li a:hover{
	color:#999;
	border:solid 3px #002040;
}
#items li span{display:block}

#top-sec-03{background-color:#fff}
#top-sec-03 div.inner{min-height:300px; padding:50px 0}

#shop{margin:50px 0}
#shop li{float:left; width:50%; text-align:center}
#shop li span{display:block; margin-top:15px}
#shop li a{color:#333}
#shop li img{border:solid 3px #ddd}
#shop li img:hover{border:solid 3px #002040;}

#top-sec-04{background-image:url(../images/about-img-01.jpg);background-size:cover; height:532px; background-position:center center; width:100%; position:relative; color:#fff; text-align:center}
#top-sec-04 h3{font-size:26px; padding:40px 0}
#top-sec-04 p.catch{font-size:16px; padding-bottom:40px}
#top-sec-04 div.line{width:50px; border-top:solid 1px #eee; margin:0 auto}
#top-sec-04 h4{margin-top:40px; font-size:24px}
#top-sec-04 h4 span{font-size:10px; color:#ddd; display:block}
#top-sec-04 ul{display:block; margin-top:40px}
#top-sec-04 ul li{font-size:16px; margin-bottom:10px}
#teikyou{font-size:10px; position:absolute; bottom:10px; right:10px}

#top-sec-05{border-top:solid 1px #ddd}
#top-sec-05 div.inner{min-height:300px; padding:50px 0}
#form{margin:50px auto 0; width:700px}
#form table{width:100%; margin-bottom:20px; border-collapse:separate; border-spacing:1px; background-color:#ddd}
#form th{text-align:right; font-weight:normal; font-size:14px; padding:15px; width:30%; background-color:#eee;}
#form th span{color:#CC0000; margin-left:3px}
#form td{font-size:14px; padding:15px; background-color:#fff}
input.txt-m{border:solid 1px #ddd; width:300px; padding:3px}
input.txt-l{border:solid 1px #ddd; width:420px; padding:3px}
textarea{border:solid 1px #ddd; width:420px; height:200px; padding:3px}
#bt_submit{font-size:16px; color:#fff; text-align:center; border:none; background-color:#002040; padding:20px; width:250px;margin:10px auto; display:block;-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;}
#bt_submit:hover{background-color:#CC0000}
#form div.line{border-left:solid 3px #000;  font-size:16px; padding:5px 15px; margin-bottom:20px}
.error{font-size:12px; color:#CC0000;}
.error + input,
.error + textarea{border:solid 1px #FCC}

#form .loading{text-align:center}
#form p{margin-top:10px}


footer{background-color:#eee; padding-top:50px; text-align:center}
#fnavi{margin-bottom:50px}
#fnavi li{display:inline; font-size:14px;margin:0 0 0 15px}
#fnavi li a{color:#333;}
#fnavi li a:hover{color:#ccc}
#fnavi li:after {content: "/"; color:#999; margin-left:15px}
#flogo{margin:50px 0}
#copy{font-size:12px; margin-top:30px; padding-bottom:20px}


#box-estimate{background-color:rgba(0,153,255,1);text-align:center; font-size:24px; position:fixed; bottom:0; left:0; width:100%; padding:15px 0; z-index:9999; color:#fff; margin-bottom:0;-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;}
#box-estimate a{color:#fff; background-image:url(../images/sprite.png); background-position:-8px -80px; padding:20px 0 15px 90px}
#box-estimate i.icon-cancel-circle{position:absolute; right:20px; top:18px; cursor:pointer; cursor:hand; z-index:10}
#box-estimate:hover{background-color:rgba(255,102,0 ,1)}

#gnavi2{position:fixed; top:0; background-color:#fff; width:100%; text-align:center; padding:10px 0; z-index:9999; border-bottom:solid 1px #ddd; opacity:0; margin-top:-50px}
#gnavi2 li{display:inline; font-size:14px;margin:0 0 0 15px}
#gnavi2 li a{color:#333;}
#gnavi2 li a:hover{color:#ccc}
#gnavi2 li:after {content: "/"; color:#999; margin-left:15px}
#logo2 a{background-image:url(../images/sprite.png); background-position:-9px -12px; width:129px; height:27px;display:block; text-indent:-9999px; position:absolute; left:20px; top:10px}


/**

Page-Common-Style

**/
section.bg-title{width:100%; height:150px; background-size:cover}
section.bg-title h2{background-color:rgba(0,0,0,0.5); height:95px; color:#fff; font-weight:normal; padding-top:55px; font-size:26px; padding-left:100px}

section.b-navi{font-size:12px; color:#999; padding:15px 0; background-color:#fff}
section.b-navi a{color:#000; font-weight:bold}
section.b-navi a:hover{color:#F90}
section.page{background-color:#fff; min-height:500px; padding:30px 0}
section.page div.left{width:77%; min-height:600px; border-right:solid 1px #ddd; padding-right:2%}
section.page div.right{width:20%; min-height:300px; padding-top:25px}

section.page h3.title{border-left:solid 5px #000; padding:10px 0 10px 25px; font:24px normal}
section.page div.date{color:#999; font-size:12px}
section.page img{max-width:100%; height:auto; width:auto; margin:2em 0}
section.page img.alignleft{float:left; padding-right:10px; margin:0}
section.page img.alignright{float:right; padding-right:10px; margin:0}
section.page img.aligncenter{text-align:center}

section.page div.right h4.title{font:16px normal; margin-bottom:15px}
section.page div.right ul{margin-bottom:30px}
section.page div.right ul ul{margin-bottom:0}
section.page div.right li{list-style:outside; list-style-type:disc; padding-left:5px; margin-left:18px; padding-bottom:8px}

#single-pager{margin-top:40px; text-align:center; padding-top:40px; border-top:solid 1px #eee; color:#ddd}

/**

NEWS

**/

#bg-news{background-image:url(../images/bg-page.jpg); background-position:center center}
div.content{min-height:500px}

@media screen and (max-width: 1024px) {
#top-box{padding-right:10px}
header h1{font-size:10px}
#gnavi{margin-top:60px;padding-left:100px}
#gnavi li{float:left; font-size:14px;margin:0 0 0 10px}
#gnavi li:after {content: "/"; color:#999; margin-left:10px}
	
}

@media screen and (max-width: 600px) {
	
#gnavi li{display:none}

#op_menu{position:absolute; top:30px; right:30px; width:20px; height:20px; cursor:pointer}
#op_menu span{width:20px; height:5px; display:block; border-top:1px solid #000; position:absolute; right:0}

#op_menu span.s_01,
#op_menu .s_01.reactive{transform: rotate(0deg); top:0px}
#op_menu span.s_02,
#op_menu .s_02.reactive{top:6px}
#op_menu span.s_03,
#op_menu .s_03.reactive{transform: rotate(0deg);top:12px}

#op_menu .s_01.active{transform: rotate(-45deg); top:7px; right:-3px}
#op_menu .s_02.active{opacity:0}
#op_menu .s_03.active{transform: rotate(45deg);top:8px}


.active,
.reactive{
	-webkit-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
}
}