@charset "utf-8";
/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:100,300,400,600,700);
@import url(https://fonts.googleapis.com/css?family=Playfair+Display|Playfair+Display+SC|Roboto:100);
@import url(https://fonts.googleapis.com/css?family=Cinzel|EB+Garamond);
@import url(https://fonts.googleapis.com/css?family=Sawarabi+Mincho);



/*ポップアップバナー用*/
@import url(popupbana.css);

/*メイン画像/上パラパラ　用
@import url(top_main.css);*/

/*facebook　用*/
@import url(facebook.css);


html, body { height: 100%; }

body{
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", 'Josefin Sans', sans-serif;
	/*font-family: "Sawarabi Mincho", 'Josefin Sans', sans-serif;*/
	font-size:14px;
	line-height:1.5;
    margin: 0;
	letter-spacing:0.05em;
	color:#363636;
    animation: fadeIn 2s ease 0s 1 normal;
    -webkit-animation: fadeIn 2s ease 0s 1 normal;
}

img{
	max-width:100%;
}

#wrapper{
	text-align:center;
/*	background:#fff;*/
	overflow:hidden;
}


a{
	color:#363636;
	text-decoration:none;
}

br.end{
	clear:both;
}


/*-----------------*/

#container{
	width:100%;
	height:auto;
	padding:/*150px 0 0 0*/80px 0 0 0;
}

#container .btn_b{
	width:500px;
	margin:50px 0!important;
}


.pc_navi{/*グローバル動作を止めるため*/
  opacity:1 !important;
  position:relative;
}
.animated {
  opacity: 1 !important;
}


@media only screen and (max-width: 789px) { 
#container{
	padding:0px 0;
}

#container .btn_b{
	width:94%;
	margin:20px auto!important;
}
}












/*タイトル
----------------------------*/

.ttl{
	font-size:50px;
	font-family: 'Josefin Sans', sans-serif;
	padding:50px 0 0 0;
	margin:/*50px*/0px 0 0 0;
	color:#333;

}

.ttl_sub{
	font-size:12px;
	color:#666;
	margin:0 auto 80px;
	letter-spacing:0.1em;
}


.under{
	border-top:1px solid /*#000*/#841604;
	padding-left:20px;
	margin-left:10px;
}


p.txt18{
	line-height:2.0;
	font-size:18px;
}


@media only screen and (max-width: 1080px) { 

.ttl{
	font-size:36px;

}

}



/*ボタン
----------------------------*/

.btn_b{
	list-style:none;
	display:inline-block;
	width:100%;
	margin:20px 0;
	z-index:99999;
	font-family: 'Josefin Sans', sans-serif;


	
}
.btn_b a{
	width:100%;
	color:#FFF;
	text-decoration:none;
	display:block;
	background:url(../../img/arrow2.png) no-repeat;
	background-position:right;
padding:20px 0;
	background-color:#000;
	text-align:center;

}



.btn_b a:hover{
	color:#841604;
	background-color:#fff;
	border:1px solid #841604;
	background:url(../../img/arrow3.png) no-repeat;
	background-position:right;
padding:19px 0;


}




li.btn_w{
	list-style:none;
	display:inline-block;
	width:100%;
	margin:20px 0;
	z-index:99999;

	
}
li.btn_w a{
	width:100%;
	color:#000;
	text-decoration:none;
	display:block;
	background:url(../../img/arrow.png) no-repeat;
	background-position:right;
padding:20px 0;
	background-color:#fff;
	text-align:center;
	border:1px solid #000;

}

li.btn_g{
	list-style:none;
	display:inline-block;
	width:100%;
	margin:20px 0;
	z-index:99999;

	
}
li.btn_g a{
	width:100%;
	color:#fff;
	text-decoration:none;
	display:block;
	background:url(../../img/arrow2.png) no-repeat;
	background-position:right;
padding:20px 0;
background-color:#B4B4B4/*#F0F0F0*/;
	text-align:center;

}


li.btn_toi{
	list-style:none;
	display:inline-block;
	width:100%;
	z-index:99999;
	margin-right:1%;

}




li.btn_toi a{
	width:480px;
	height:110px;
	font-size:16px;
	color:#333 !important;
	text-decoration:none;
	display:block;
	background:url(../../img/arrow.png) no-repeat;
	background-position:right;
	background-color:#eee;
	text-align:center;
	 border-radius: 4px;
	vertical-align:middle;
	display: table-cell; /* IE8から使用可能 */

}

li.btn_toi a:hover{
	background-color:/*#841604*/#333;
	color:#fff !important;
}

li.btn_tel{
	list-style:none;
	display:inline-block;
	width:100%;
	z-index:99999;
font-family: 'Josefin Sans', sans-serif;
}



li.btn_tel a{
	font-size:24px;
	width:100%;
	color:#fff !important;
	text-decoration:none;
	display:block;
	background-color:rgba(0,0,0,0.5);
	text-align:center;
	 border-radius: 4px;
	 width:480px;
	height:110px;
	vertical-align:middle;
	display: table-cell; /* IE8から使用可能 */
}

li.btn_tel a:hover{
	/*background-color:#333;*/
	color:#fff !important;
}

li.btn_tel .small{
	font-size:12px !important;
	 font-family: "Sawarabi Mincho";
}
@media only screen and (max-width: 1080px) { 

li.btn_tel a{
	background:none;
	font-size:28px;
	 width:100%;
	height:auto;


}

li.btn_tel a:hover{
	background-color:none;
}


li.btn_toi a{
	width:94%;
	line-height:110px;
	display:block;
	margin:0 auto;

}

li.btn_tel a{
	width:94%;
	display:block;
	margin:0 auto;
	padding-top:5%;
	
}



}
/*-----------------*/


.main_comm{
	width:45%;
	text-align:center;
	float:left;
}


#ex{
	width:10%;
	color:#fff;
	float:left;
}


.left{
	position:relative;
	width:100%;
}


.text-container {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
	color: white;
	letter-spacing: 4px;
	font-size: 34px;
	-webkit-font-smoothing: antialiased;
	text-align: center;
	z-index:9999;
}


.text-container2 {
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
	color: white;
	letter-spacing: 4px;
	font-size: 34px;
	-webkit-font-smoothing: antialiased;
	text-align: center;
	z-index:9999;
}





/*------------------

インフォメーション

-------------------*/


#info{
	width:100%;
	background-color:rgba(255, 255, 255,0.8);
	position:relative;
	margin-top:-21px;
	padding:30px 0 10px 0;
	color:#777;
}

#info_in{
	width:850px;
	margin:0 auto;
	
}
#info .box{
	display:inline-block;
	vertical-align:top;
}

#info .ttl2{
	width:20%;
	font-family: 'Josefin Sans', sans-serif;
	color:#841604;
}

#info .news{
	width:78%;
	
}


#info .news dl{
	width:100%;
	height:auto;
	clear:both;
	font-size:12px;
}


#info .news dt{
	width:120px;
	height:auto;
	float:left;
}

#info .news dd{
	width:500px;
	height:auto;
	float:right;
	padding-bottom:20px !important;

}


@media screen and (max-width : 1080px){



#info{
	width:100%;
	padding:20px 0 10px 0;
	background-color:rgba(255, 255, 255,0.8);


}

#info_in{
	width:94%;
	margin:0 auto;
	
}
#info .box{
	display:inline-block;
	vertical-align:top;
}

#info .ttl2{
	width:100%;
	text-align:center;
	margin-bottom:10px;
}

#info .news{
	width:100%;
	
}


#info .news dl{
	width:100%;

}


#info .news dt{
	width:20%;
}

#info .news dd{
	width:76%;

}



}


/*--------

会社について

-------*/

#about_bg_w{
	width:100%;
	background-color:#FFF !important;
}

/*
#about_bg{
	width:100%;
	text-align:center;
	background-image:url(../img/top/bg_company.jpg);
	background-repeat:no-repeat;
	background-size:100%;
	background-position:bottom left;
	padding:50px 0 100px 0;

}*/


#about_bg{
	width:100%;
	text-align:center;
	background-image:url(../../img/top/bg_company.jpg);
	background-repeat:no-repeat;
	background-size:100%;
	background-position:bottom right;
	padding:50px 0 100px 0;

}



#about{
	max-width:1000px;
	margin:0 auto;

}


#about p{
	line-height:2.5;
}

#about .btn_b{
	/*width:40%;*/
	width:500px;
	margin-top:30px;
}


/*

#about_bg{
	width:100%;
	background:url(img/top/aboutus.jpg) no-repeat left;
	background-size:65%;
	margin-top:100px;
}



#about{
	width:20%;
	font-family: 'Josefin Sans', sans-serif;
	padding:5%;
	margin-left:70%;


}

*/



@media screen and (max-width : 1080px){

#about_bg{
	width:100%;
	text-align:center;
	background-size:cover;
	background-position:bottom left !important;
	padding:0px 0 50px;

}

#about{
	max-width:90%;
	margin:0 auto;

}


#about p{
	line-height:2.5;
	text-align:left;
}

#about p br{
	display:none;
}

/*

#about .btn_b{
	width:30%;
	margin-top:30px;
}*/


#about ul li{
	width:100% !important;
	max-width:auto;
}
#about ul li a{
	width:100% !important;
	display:block;
}





/*#about_bg{
	background-size:100%;
	background-position:top;
}



#about{
	width:90%;
	padding:45% 0 0 0;
	margin-left:5%;


}




#about li.btn{
	margin:20px 0;
	z-index:99999;

	
}
#about br{
	display:none;
}
*/


}




/*
サービスコンテンツ
------------------------------------------------------------------------------------*/
#service {
	width:100%;
	margin-top:0px;
	padding:80px 0;
	background-color:#fff;
}
#service .title{
	text-align:center;
}


#service_contents{
	overflow:hidden;
	padding:20px auto 50px auto;
/*	margin:0 auto 90px auto;*/


}
#service dl{
	width:1000px;
	text-align:center;
}

#service .btn_b{
	width:40%;
	margin-top:30px;
}



.page-index {
	margin:35px auto　;
}
/*
.page-index .entry:hover,.page-index .entry2:hover { 
box-shadow: 0 15px 30px -15px rgba(0,0,0,.3),0 0 5px rgba(0,0,0,.05); 
transform: translateY(-15px); 
transition: 0.5s; 
}

.entry{
	width:100%;
	vertical-align:top;
	margin:0 auto;
	padding-bottom:50px;
}*/

.entry2{/*横長OEM*/
	width:80%;
	padding:1% 0;
	float:left;
	vertical-align:top;
	margin-bottom:10px;
	margin:50px 10% 0 10%;
}





.entry img,.entry2 img{
	width:100%;
}

.entry dl{
	width:80%;
	margin:50px auto ;
	text-align:left;
	line-height:1.8;
	font-size:11px;
}
.entry2 dl{
	width:80%;
	margin:0 auto ;
	text-align:left;
	line-height:1.8;
	font-size:11px;
	margin-top:-15%;
	color:#fff;
	padding-bottom:120px;
}

.entry dt,.entry2 dt{
	font-family: 'Josefin Sans', sans-serif;
	font-size:30px;
	margin-bottom:5px;
}

.entry dd,.entry2 dd{
	margin-left:0px;
	font-size:16px;
}

.entry dt span,.entry2 dt span{
	/*font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;*/
	font-size:11px;
	color:#666;
	margin:0 0 0px 20px;
	letter-spacing:0.1em;
}

.entry dt br,.entry2 dt br{
	display:none;
}



.entry2 dt span{
	color:#fff;
}


/*
サービスバナーバージョン
------------------------------------------------------------------------------------*/
#service_2{
	width:100%;
	max-width:1400px;
	height:auto;
	padding:80px 0;
	margin:0 auto;
	text-align:center;
}

#service_2 .bana{
	width:45%;
	margin:0 1% 0 1%;
	display:inline-block;
	text-align:left !important;
}

#service_2 .bana a{
	display:block;
}

#service_2 .bana a:hover p,#service_2 .bana a:hover .ttl5,#service_2 .bana a:hover .ttl6{
	color:#841604;
}



#service_2 .bana .left_bana{
	width:50%;
	float:left;
	height:auto;
	
}



#service_2 .bana .left_bana img {
  width: 100%;
  height: 180px;
  object-fit: cover; /* この一行を追加するだけ！ */
}




#service_2 .bana .right_bana{
	width:46%;
	height:160px;
	float:left;
	background-color:#ececec;
	/*color:#000;*/
	padding:10px;
}


#service_2 .bana .right_bana img{
	width:100%;
}


#service_2 .bana p{
	font-size:14px;
}
#service_2 .ttl5{
	font-size:30px;
	font-family: 'Josefin Sans', sans-serif;
	margin-top:10px;

}

#service_2 .ttl6{
	font-size:14px;
	padding-bottom:10px;
}

#service_2 p{
	font-size:12px;
}


@media only screen and (max-width: 789px) { 


/*
サービスコンテンツスマホ
------------------------------------------------------------------------------------*/
#service {
	margin-top:0px;
	padding:0px;
}
#service .title{
	text-align:center;
}



#service dl{
	width:90%;
	text-align:left;
}

#service .btn_b{
	width:100%;
	margin-top:30px;
}

#service_contents{
	margin-bottom:0px;
	overflow:hidden;
	padding:0px 0 /*60*/0px;

}

.entry{
	/*width:50%;*/
	width:100%;
	margin:0 auto 20px;
}

.entry2{
	width:90%;
	padding:1% auto;
	float:left;
	vertical-align:top;
	margin-bottom:10px;
	margin:50px 5% 0 5%;
}



.entry dl{
	width:90%;
	margin:20px auto;
	font-size:12px;
	padding-bottom:20px;

}
.entry2 dl{
	width:90%;
	margin:20px auto 0 auto;
	font-size:12px;
	margin-top:10px;
	color:#000;
	padding-bottom:50px;

}



.entry dt,.entry2 dt{
	font-size:24px;

}



.entry dt span,.entry2 dt span{
	color:#000;
	font-size:10px;
}
.entry dd,.entry2 dd{
	margin-top:0px;
}

.entry dt br,.entry2 dt br{
	display:block;
	margin-top:-20px;
}


/*------------------------*/
#service_2{
	width:100%;
	max-width:100%;
	height:auto;
	padding:0px 0;
	margin:0 auto;
	text-align:center;
}

#service_2 .bana{
	width:/*100*/94%;
	margin:0 auto 50px 3%;
	display:inline-block;
	text-align:left !important;
}



#service_2 .bana .left_bana{
	width:48%;
	float:left;
	height:auto;
	margin:0 0 0 -1%;
	
}


#service_2 .bana .right_bana{
	width:48%;
	height:160px;
	float:left;
	background-color:#ececec;
	color:#000;
	padding:10px;
	margin:0 0 0 -1%;

}




#service_2 .bana p{
	font-size:12px;
}
#service_2 .ttl5{
	font-size:20px;
	font-family: 'Josefin Sans', sans-serif;

}

#service_2 .ttl6{
	font-size:12px;
	padding-bottom:10px;
}

#service_2 p{
	font-size:10px;
}



}




#bar{/*動画*/
	width:100%;
	height:auto;
	text-align:center;
	margin-top:/*150*/0px;
	background-color:#FFF !important;
	padding:50px 0;
	z-index:999999999;
}

#bar li{
	width:250px;
	margin:0 1%;
	display:inline-block;
	vertical-align:top;
}


#bar2{/*協賛*/
	width:100%;
	text-align:center;
	margin-top:0px;
	background-color:#FFF !important;
	padding:50px 0;
}

#bar2 .ttl4{
	font-size:20px !important;
	margin-bottom:30px;
	color:#9B9B9B;
	font-family: 'Josefin Sans', sans-serif;
}

#bar2 ul li{
	width:46%;
	max-width:500px;
	height:60px;
	line-height:60px;
	margin:0 1%;
	display:inline-block;
	vertical-align:top;
	color:#999;
	text-align:center;
/*	text-indent:90px;*/

}

#bar2 ul li a{
	color:#999;
}



#bar2 ul li img{
	float:left;
}


#bar2 ul li p{
	float:left;

}
#bar2 ul li br{
	display:none;
}


/*
#bar2 ul li:nth-child(1){
	background-image:url(img/comm/kyousan1.jpg);
	background-repeat:no-repeat;
	background-position:left;

}
#bar2 ul li:nth-child(2){
	background-image:url(img/comm/kyousan2.jpg);
	background-repeat:no-repeat;
	background-position:left;

}
*/


@media only screen and (max-width: 789px) { 
#bar li{
	width:90%;
}

#bar2{
	padding:20px 0 10px 0;
}

#bar2 .ttl4{
	margin-bottom:10px;
}


#bar2 ul li{
	max-width:auto;
	font-size:10px;
		line-height:12px;
		text-align:left;
		vertical-align:middle;

}



#bar2 ul li img{
	width:55px;
}



#bar2 ul li br{
	display:block !important;
}


}




/*----------

フッター

-----------------*/

footer{
	/*font-family: 'Josefin Sans', sans-serif;*/
	width:100%;
	padding:0px 0;
	margin-top:/*150*/0px;
	background-color:#FFF !important;
}







footer #toi {
		width:100%;
	height:100%;
	text-align:center;
	background-image:url(../../img/comm/bg.jpg);
	background-repeat: no-repeat;
	background-attachment:fixed !important;
background-size:cover;
background-position:center bottom;

}







footer #toi_bg{
		width:100%;
	height:100%;
	padding:80px 0;
	display:block;
	color:#fff;
background-color: rgba(0,0,0,0.6);

}


footer #toi a{
	color:#fff;

	/*width:100%;
	height:100%;
	padding:80px 0;
	display:block;
background-color: rgba(0,0,0,0.6);*/
}

footer #toi .toi2 {
	/*background:url(img/arrow2.png) no-repeat;
	background-position:54%;*/
	font-weight:bold;
	font-size:18px;
	font-family: 'Josefin Sans', sans-serif;


}


footer #toi span{
	font-size:/*12px*/18px;
	margin-top:20px;
	font-weight:600;
	display:block;
}

footer #toi span br{
	display:none !important;
}



footer #toi ul li{
	width:20%;
	vertical-align:top;
	display:inline-block;
	margin-top:30px;
}



/*---------------*/



#footer_navi_bg{
	background-color:#202020;
	padding:100px 5%;
	color:#999;
	z-index:99999999999999 !important;
}






#footer_navi_bg a{
	color:#CCCCCC;
}

#footer_navi ul.navi2{
	width:100%;
	font-family: 'Josefin Sans', sans-serif;
}

#footer_navi ul.navi2 li{
	list-style:none;
	display:inline-block;
	vertical-align:top;
	font-size:14px;
	font-weight:400;
	margin:0 3%;

}
#footer_navi ul.navi2 ol{
	margin-top:20px;
}


#footer_navi ul.navi2 ol li{
	display:block;
	width:100%;
	font-size:12px;
	line-height:2.5;
}

#footer_navi ul li#logo2{
	width:100px;
	height:auto;
	margin-right:50px;
	margin-top:-10px;
	text-align:left !important;
	margin-left:0px;
}




#footer_navi ul#sns{
	margin-top:50px;
}


#footer_navi ul#sns li{
	width:auto;
	margin-right:15px;
	list-style:none;
	display:inline-block;
	vertical-align:top !important;
}

#footer_navi ul#sns li img{
	height:25px;
}


#footer_navi ul#policy{
	width:100%;
	list-style:none;
	display:inline-block;
	margin-top:50px;
}

#footer_navi ul#policy li{
	font-size:11px;
	text-align:center;
	display:inline-block;
}




#footer_navi ul#policy li.border:after{
	content:"　|　";
}



/**/
#footer_navi small{
	position:absolute;
	text-align:left;
	margin:30px 2% 0 0;
	font-size:12px;
	
}

#footer_navi #copyright{
	font-family: 'Josefin Sans', sans-serif;
}



@media only screen and (max-width: 1080px) { 


#footer_navi ul li#logo2 img{
	width:100px;
	height:auto;
	margin-right:0px;
}




#footer_navi_bg{
	padding:100px 5% 200px 5%;
}

footer #toi .toi2 {
	text-indent:0 !important;

}

footer #toi {
	background:none;
}

footer #toi #toi_bg2{
	width:100%;
	height:100%;
	background-size:cover;
	background-image:url(../../img/comm/bg.jpg);
	background-position:center;

}



footer #toi_bg{
	padding:50px 0;
}






#footer_navi ul.navi2 li#logo2{
	margin:0px 0 20px 0;
	clear:both;
	width:100%;
	/*text-align:center;*/
}
#footer_navi ul.navi2 li{
	width:40%;
	margin:0px auto;
	line-height:2.5;
}
#footer_navi ul.navi2 ol{
	margin:0px 2%;
} 
#footer_navi ul.navi2 ol li{
	font-size:12px;
}

#footer_navi ul#sns{
	width:100%;
}


#footer_navi ul#sns li{
	width:/*10*/20%;
	line-height:23px;
	margin-right:2%;
	vertical-align:top;
	text-align:center;
}

#footer_navi ul#sns li img{
	height:23px;
}



#footer_navi ul#policy{
		display:block;

}

#footer_navi ul#policy li{
	text-align:center;
}




#footer_navi ul#policy li.border:after{
}



footer #toi ul li{
	width:94%;
	text-align:center;
}
footer #toi span{
	font-size:14px;
	margin-top:20px;
	font-weight:600;
}



}



#page-top{
	display:block;
	position:fixed;
	bottom:/*18%*/150px;
	right:15px;
}
@media only screen and (max-width: 1080px) { 


}



@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}