@charset "utf-8";

/**
 *
 *  サイト共通
 *
 */

/*--------------------------------------------------------------------------
   reset
---------------------------------------------------------------------------*/

html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,ins,kbd,q,samp,small,strong,
sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,
figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:transparent;}
body{line-height:1;}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block;}
nav ul{list-style:none;}
ul,ol,li,dl,dt,dd{list-style-type:none;list-style-position:outside;}
blockquote,q{quotes:none;}
blockquote:before,blockquote:after,q:before,q:after{content:none;}
a{margin:0;padding:0;vertical-align:baseline;background:transparent;}
img{vertical-align:top;border:0;}
table{border-collapse:collapse;border-spacing:0;}
hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:0;padding:0;}
input,select{vertical-align:middle;}


/*--------------------------------------------------------------------------
   html
---------------------------------------------------------------------------*/

html{
	overflow-y:scroll;
	font-size:10px;
}


/*--------------------------------------------------------------------------
   body
---------------------------------------------------------------------------*/

body{
	color:#393938;
	background:#FFF;
	font-family:"Noto Sans Japanese","ヒラギノ角ゴ ProN W3","Hiragino Kaku Gothic ProN","Yu Gothic","YuGothic","メイリオ",Meiryo ,"ＭＳ Ｐゴシック" ,"MS P Gothic" ,sans-serif;
	font-size:1.6rem;
	line-height:1.8;
	height: 100%;	
}

/* fonts */
.f_en{
	font-family: "Oswald", sans-serif;
}

/*--------------------------------------------------------------------------
   base link
---------------------------------------------------------------------------*/

a{
	outline:none;
}
a:link,
a:visited{
	color:#333;
	text-decoration:none;
}

.ophover{
	-webkit-transition:opacity ease 0.3s;
	-moz-transition:opacity ease 0.3s;
	transition:opacity ease 0.3s;	
}
.ophover:hover{
	opacity: 0.7;
}


/*--------------------------------------------------------------------------
   Animation
---------------------------------------------------------------------------*/

.fade, .fade01, .fade02,
.fade_delay01,.fade_delay02,.fade_delay03,.fade_delay04,.fade_delay05 {
	transition: 1s;
}
.fade {
	opacity: 0;
	transform: translate(0,100px); 
	-webkit-transform: translate(0,100px);
}
.fade01{
	opacity: 0;
	transform: translate(0,120px); 
	-webkit-transform: translate(0,120px);
	transition-delay:0.5s;	
}
 .fade02 {
	opacity: 0;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
}
.fade_delay01{
	opacity: 0;
	transform: translate(0,100px); 
	-webkit-transform: translate(0,100px);
	transition-delay:0.3s;		
}
.fade_delay02{
	opacity: 0;
	transform: translate(0,100px); 
	-webkit-transform: translate(0,100px);
	transition-delay:0.9s;		
}
.fade_delay03{
	opacity: 0;
	transform: translate(0,100px); 
	-webkit-transform: translate(0,100px);
	transition-delay:1.2s;		
}
.fade_delay04{
	opacity: 0;
	transform: translate(0,100px); 
	-webkit-transform: translate(0,100px);
	transition-delay:1.5s;		
}
.fade_delay05{
	opacity: 0;
	transform: translate(0,100px); 
	-webkit-transform: translate(0,100px);
	transition-delay:1.8s;		
}

 .mv {
	opacity: 1;
	transform: translate(0,0); 
	-webkit-transform: translate(0,0);
	
	  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
}


/* baloon animation */

.bounce{
    opacity: 0;
    position: relative;
	transition:.9s;
}
.bounce.mv{
    -webkit-animation: bounceIn 900ms ease both;
    -moz-animation: bounceIn 900ms ease both;
    animation: bounceIn 900ms ease both;
	opacity: 1;
}

@-webkit-keyframes bounceIn {
    0% { -webkit-transform: scale(.3); }
    50% { -webkit-transform: scale(1.05); }
    70% { -webkit-transform: scale(.9); }
    100% { -webkit-transform: scale(1); }
}

@-moz-keyframes bounceIn {
    0% { -moz-transform: scale(.3); }
    50% { -moz-transform: scale(1.05); }
    70% { -moz-transform: scale(.9); }
    100% { -moz-transform: scale(1); }
}
@keyframes bounceIn {
    0% { transform: scale(.3); }
    50% { transform: scale(1.05); }
    70% { transform: scale(.9); }
    100% { transform: scale(1); }
}


/*--------------------------------------------------------------------------
   PC
---------------------------------------------------------------------------*/
.sp{
	display:none;	
}
/* box-sizing ---*/	
header, footer, section, div, h1, h2, h3, h4, h5, p, ul, ol, li, dl, dt, dd, table, th, td, a, span, input, textarea, select, option {
	box-sizing: border-box;
}



/*--------------------------------------------------------------------------
   Container
---------------------------------------------------------------------------*/
.inner{
	width:1200px;
	margin:0 auto;
}

/*--------------------------------------------------------------------------
   Header
---------------------------------------------------------------------------*/
#Header{
	position:fixed;
	left:0;
	top:0;
	width: 300px;
	z-index:20000;
}
#Header::before{
	position: fixed;
	left:0;
	top:0;
	z-index:500;
	display:block;
	content:"";
	width: 300px;
	height: 100%;
	background:#FFF;
	border-right:1px solid #E5E5E5;	
}
#Header::after{
	position: fixed;
	left:0;
	top:0;
	z-index:400;
	display:block;
	content:"";
	width: 300px;
	height: 100%;
	background:#F7F7F7;	
	transition:0.2s;
}
#Header.open::after{
	left:300px;
}



#Header .logo{
	position: relative;
	z-index:100;
	margin: 45px 0 30px;
	text-align:center;	
}

/* ---------------------------------------------------------------------------
			#Gnav	
				グローバルナビゲーション
--------------------------------------------------------------------------- */
.header-inner{
	position: relative;
	z-index:1000;	
}
#Gnav{
	margin-bottom: 30px;	
}
#Gnav ul .sp{
	display:none;	
}
#Gnav ul li{
	height: 58px;
	line-height:58px;
}
#Gnav ul li a,
#Gnav ul li > span{
	display:block;
	width: 100%;
	height: 100%;
	padding-left: 25px;
	border-left:6px solid transparent;	
	cursor:pointer;
}
#Gnav ul li a span.blank{
	padding-right: 18px;
	background:url(../images/common/ico_blank_b_s.png) no-repeat right center;	
}
#Gnav ul li.current > a,
#Gnav ul li.current > span{
	border-left-color:#F6891F;	
}
#Gnav ul li a:hover,
#Gnav ul li > span:hover{
	border-left-color:#F6891F;
	background-color:#F7F7F7;
}
#Gnav ul li.trigger{
	position: relative;
}
#Gnav ul li.trigger:hover{
	background-color:#F7F7F7;
}
#Gnav .lower-nav{
	display:none;
	position: absolute;
	left:0;
	top:-58px;
	width: 300px;
	transition:.2s;
}
#Gnav .lower-nav.l-nav01{
	top:-29px;
}
#Header.open .on .lower-nav{
	display:block;
	left:300px;	
}
#Header .inq-btn{
	margin-bottom: 25px;
}
#Header  .inq-btn a{
	width: 224px;
	margin: 0 auto;
	height: 50px;
	line-height:50px;
	font-size:1.4rem;
	background-size:14px auto;
	background:#393A38;	
}
#Header  .inq-btn a:hover{
	background:#F6891F;	
	opacity:1;
}
#Header  .inq-btn em{
	display:none;
}
#Header  .security{
	text-align:center;	
}
#Header  .security li{
	display:inline-block;	
}

.sns_con{
    display: flex;
    margin: 25px auto;
    justify-content: center;
}


.sns_con >li{
 margin-right: 15px;
}


/* サイドナビ 高さ調整 short01
-----------------------------------------------------------------*/
#Header .short01 .logo{
	margin: 40px 0 35px;
}
.short01 #Gnav ul li{
	height: 50px;
	line-height:50px;
}
.short01 #Gnav .lower-nav{
	top:-50px;
}
#Gnav .lower-nav.l-nav01{
	top:-25px;
}
#Header .short01 .inq-btn{
	margin-bottom: 40px;		
}

/* サイドナビ 高さ調整 short02
-----------------------------------------------------------------*/
#Header .short02 .logo{
	margin: 30px 0 25px;
}
.short02 #Gnav ul li{
	height: 45px;
	line-height:45px;
	font-size:1.4rem;
}
.short02 #Gnav .lower-nav{
	top:-45px;
}
#Gnav .lower-nav.l-nav01{
	top:-23px;
}
#Header .short02 .inq-btn{
	margin-bottom: 20px;		
}


/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/
#Content {
	/*margin-left: 300px;*/
	min-width:1200px;
	overflow:hidden;
}

/* ico
-----------------------------------------------------------------*/
.ico{
	position: absolute;	
}

/* img_zoom
-----------------------------------------------------------------*/
.img_zoom{
	overflow:hidden;	
}
.img_zoom img{
	transition:.5s;	
}
a:hover .img_zoom img,
.img_zoom a:hover img{
	transform:scale(1.1);	
}


/* color
-----------------------------------------------------------------*/
.or{
	color:#F6881F;	
}

/* marker
-----------------------------------------------------------------*/
.marker_o{
	background: linear-gradient(transparent 55%, #FAC38F 55%);
}

/*--------------------------------------------------------------------------
   Buttons
---------------------------------------------------------------------------*/
.btn_base_b a,
.btn_base_w a,
.btn_base_ghost_w a,
.btn_base_ghost_b a,
.btn_base_gra a,
.inq_btn_base a{
	display:block;
	width: 100%;
	height: 100%;
	text-align:center;
	transition:.3s;
}

.inq_btn_base a:hover{
	opacity:.7;	
}

/* ボタン黒 */
.btn_base_b a{
	width: 300px;
	height: 54px;
	line-height:54px;
	font-size:1.5rem;
	color:#FFF;
	background:#393A38;		
}
.btn_base_b a:hover{
	background:	#F6881F;
}
.btn_base_b span{
	padding-left: 18px;
	background:url(../images/common/arw_h_w_s.png) no-repeat left center;
	background-size:8px auto;
	transition:.3s;	
}
.btn_base_b a[target="_blank"] span{
	padding: 0 18px;
	background:url(../images/common/arw_h_w_s.png) no-repeat left center, url(../images/common/ico_blank_w_s.png) no-repeat right center;
	background-size:8px auto, 13px auto;		
}
.btn_base_b a:hover span{
	background-position:5px center;
}
.btn_base_b a[target="_blank"]:hover span{
	background:url(../images/common/arw_h_w_s.png) no-repeat 5px center, url(../images/common/ico_blank_w_s.png) no-repeat right center;
	background-size:8px auto, 13px auto;
}

/* ボタン白 */
.btn_base_w a{
	width: 300px;
	height: 54px;
	line-height:54px;
	font-size:1.5rem;
	color:#000;
	background:#FFF;
	border:1px solid #393A38;		
}
.btn_base_w a:hover{
	background:	#393A38;
	color:#FFF;
}
.btn_base_w span{
	padding-left: 18px;
	background:url(../images/common/arw_h_b_s.png) no-repeat left center;
	background-size:8px auto;
	transition:.3s;	
}
.btn_base_w a[target="_blank"] span{
	padding: 0 18px;
	background:url(../images/common/arw_h_b_s.png) no-repeat left center, url(../images/common/ico_blank_b_s.png) no-repeat right center;
	background-size:10px auto, 10px auto;		
}
.btn_base_w a:hover span{
	background-image:url(../images/common/arw_h_w_s.png);
	background-position:5px center;
}
.btn_base_w a[target="_blank"]:hover span{
	background:url(../images/common/arw_h_w_s.png) no-repeat 5px center, url(../images/common/ico_blank_w_s.png) no-repeat right center;
	background-size:8px auto, 10px auto;
}



/* ボタン グラデーション */
.btn_base_gra a{
	width: 300px;
	height: 54px;
	line-height:54px;
	font-size:1.5rem;
	color:#FFF;
	background: linear-gradient(60deg, #f6891f 0%,#ff7373 100%); 		
}
.btn_base_gra span{
	padding-left: 18px;
	background:url(../images/common/arw_h_w_s.png) no-repeat left center;
	background-size:8px auto;
	transition:.3s;	
}
.btn_base_gra a:hover span{
	background-position:5px center;
}



/* ゴーストボタン 白 */
.btn_base_ghost_w a{
	height: 87px;
	line-height:87px;
	border:2px solid #FFF;
	height: 87px;
	line-height:87px;
	font-size:1.7rem;
	color:#FFF;
	background:rgba(255,255,255,0);
}
.btn_base_ghost_w a span{
	padding: 5px 0 5px 45px;
	background:url(../images/common/arw_v_w_b.png) no-repeat left center;
	background-size:30px auto;
	transition:.3s;
}
.btn_base_ghost_w a:hover span{
	background-position:left 10px;
}
.btn_base_ghost_w a:hover{
	background:rgba(255,255,255,0.3);	
}

/* ゴーストボタン 黒 */

.btn_base_ghost_b a{
	height: 87px;
	line-height:87px;
	border:2px solid #000;
	height: 87px;
	line-height:87px;
	font-size:1.7rem;
	color:#000;
	background:rgba(255,255,255,0);
}
.btn_base_ghost_b a span{
	padding: 5px 0 5px 45px;
	background:url(../images/common/arw_v_b_b.png) no-repeat left center;
	background-size:30px auto;
	transition:.3s;
}
.btn_base_ghost_b a:hover span{
	background-position:left 10px;
}
.btn_base_ghost_b a:hover{
	background:rgba(0,0,0,0.3);	
}

/* お問い合わせボタン */
.inq_btn_base a{
	width: 420px;
	height: 73px;
	line-height:73px;
	font-size:1.8rem;
	color:#FFF;
	background:#F6891F;	
}
.inq_btn_base span{
	padding-left: 32px;
	background:url(../images/common/ico_mail.png) no-repeat left center;
	background-size:16px auto;	
}

/* 上下ライン ボタン */
.btn_base_line{
	border-top:1px dotted #CDCECD;
	border-bottom:1px solid #393A38;	
}
.btn_base_line a{
	display:block;
	padding: 15px 0 15px 35px;
	background:url(../images/common/arw_h_o_s.png) no-repeat left center;	
	font-size:1.5rem;
	transition:.3s;
}
.btn_base_line a:hover{
	background-color:#FFE0C1;
	background-position:8px center;	
}
.btn_base_line a span{
	padding-right: 18px;
	background:url(../images/common/ico_blank_b_s.png) no-repeat right center;	
}


/* テキストリンク
-----------------------------------------------------------------*/
.txt_link_base_o a{
	padding-left: 16px;
	background:url(../images/common/arw_h_o_s.png) no-repeat left center;
}
.txt_link_base_o a:hover{
	color:#F6902D;	
}


/*--------------------------------------------------------------------------
   新着情報 汎用
---------------------------------------------------------------------------*/
.news_list dt{
	margin-bottom: 10px;
	font-weight:bold;	
}
.news_list dt .cat{
	position: relative;
	top:-2px;
	display:inline-block;
	width: 90px;
	margin-right: 12px;
	background:#F6891F;
	font-weight:normal;
	font-size:1.2rem;
	color:#FFF;	
	text-align:center;
}
.news_list dd{
	margin-bottom: 35px;
	padding-bottom: 15px;
	border-bottom:1px solid #D8D8D8;
}


/*--------------------------------------------------------------------------
   タイトル 汎用
---------------------------------------------------------------------------*/

/* セクションタイトル */
.ttl_sec{
	font-size:4.4rem;
	line-height:1.4em;
}
.ttl_sec span{
	display:block;
	font-size:2.5rem;
	color:#F6891F;	
}

/* ラインつきタイトル */
.ttl_line{
	position: relative;
	padding-bottom: 30px;
	font-size:3.8rem;	
}
.ttl_line::after{
	position: absolute;
	left:0;
	bottom:0;
	display:block;
	content:"";
	width: 57px;
	height: 5px;
	background:#F6881F;
	margin-bottom: 20px;
}

/*--------------------------------------------------------------------------
   カード枠
---------------------------------------------------------------------------*/
.card{
	padding: 50px 60px;
	background:#FFF;
	box-shadow: 0 5px 20px 0 rgba(0,0,0,.08);
}

/*--------------------------------------------------------------------------
   Cv
---------------------------------------------------------------------------*/
#Cv{
	padding: 60px 0 65px;
	background:#393A38;
	text-align:center;
	color:#FFF;
}
#Cv h2{
	font-size:1.8rem;
	margin-bottom: 25px;
	font-weight:normal;	
}
#Cv .inq-btn{
	width: 420px;
	margin: 0 auto;
	background:#FFF;	
}

/*--------------------------------------------------------------------------
   txt-link
---------------------------------------------------------------------------*/
.txt-link ul{
	width:1200px;
	margin:0 auto;
	padding: 30px 0;
	text-align:center;
	border-bottom:1px solid #D8D8D8;
}
.txt-link ul li{
	display:inline-block;
	padding: 0 15px;	
}
.txt-link ul li a{
	padding: 0 5px;	
	transition:.3s;
}
.txt-link ul li a:hover{
	opacity:.7;	
}
.txt-link ul li span.blank{
	padding-right: 16px;
	background:url(../images/common/ico_blank_b_s.png) no-repeat right center;
}
.news_list a:hover{
	color:#F6891F;	
}

/*--------------------------------------------------------------------------
   CompanyInfo
---------------------------------------------------------------------------*/
#CompanyInfo{
	padding: 50px 0 55px;	
}
#CompanyInfo h2{
	margin-bottom: 37px;
	text-align:center;	
}
#CompanyInfo ul{
	display:flex;
	width: 960px;
	margin: 0 auto;	
	font-size:1.4rem;
}
#CompanyInfo ul li{
	position: relative;
	width: 50%;
	padding: 0 20px 0 0;	
}
#CompanyInfo ul li+li{
	padding: 0 0 0 20px;	
}
#CompanyInfo ul h3{
	position: absolute;
	width: 95px;
	height: 95px;
	padding-top: 32px;
	border:1px solid #D8D8D8;
	text-align:center;
	font-weight:normal;
	font-size:1.4rem;	
}
#CompanyInfo ul p{
	padding-left: 115px;
	line-height:1.6;	
}
#CompanyInfo ul p.googlemap a{
	padding: 0 22px 0 13px;
	background:url(../images/common/arw_h_b_s.png) no-repeat left 5px, url(../images/common/ico_blank_b_s.png) no-repeat right 6px;
	background-size:8px auto, 10px auto;	
}
/*--------------------------------------------------------------------------
   Footer
---------------------------------------------------------------------------*/
#Footer .gotop{
	position:fixed;
	right:35px;
	bottom:30px;
	background:#979796;
	overflow:hidden;
}
#Footer .gotop.bottom{
	bottom:110px
}
#Footer .gotop img{
	position: relative;
	top:0;
	transition:.3s;	
}
#Footer .gotop:hover img{
	top:-5px;
}

#Footer .security{
	padding: 35px 0 25px 0;
	background:#F5F5F5;	
}
#Footer .security .inner{
	display:flex;	
}
#Footer .icons{
	width: 50%;	
}
#Footer .icons li{
	display:inline-block;
}
#Footer .icons li+li{
	margin-left: 19px;	
}
#Footer .u-link{
	width: 50%;
	padding-top: 20px;
	text-align:right;
	font-size:1.4rem;	
}
#Footer .u-link li{
	display:inline;
	line-height:1;
	border-left:1px solid #000;	
}
#Footer .u-link li:first-child{
	border-left:none;	
}
#Footer .u-link li a{
	padding: 0 5px 0 10px;
	transition:.3s;	
}
#Footer .u-link li a:hover{
	opacity:.7;	
}
#Footer .copyright{
	padding: 25px 0;
	background:#393A38;
	text-align:center;
	color:#FFF;
	font-size:1.4rem;
}



/* clearfix
-----------------------------------------------------------------*/
.cf:before,
.cf:after{
	content:"";
	display:table;
}
.cf:after{
	clear:both;
}
.cf{
	zoom:1;
}