@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;font-size:100%;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;font-size:100%;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;
}


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

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

/* fonts */
.serif{
	font-family:"YuMincho","Yu Mincho","HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

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

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

.ophover{
	transition:opacity ease 0.3s;	
}
.ophover:hover{
	opacity: .7;
}

/*--------------------------------------------------------------------------
   table
---------------------------------------------------------------------------*/
table{
	border-collapse:collapse;	
}
td,th{
	border:1px solid #3D3D3D;
}

/*--------------------------------------------------------------------------
   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);
}

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



/*--------------------------------------------------------------------------
   Container
---------------------------------------------------------------------------*/
#Page{
	border:10px solid #4574BA;
	min-width:1220px;	
}
.inner{
	width: 1200px;
	margin:0 auto;
}

/*--------------------------------------------------------------------------
   Header
---------------------------------------------------------------------------*/
#Header{
	position: fixed;
	left:0;
	top:0;
	z-index:5000;
	width: 100%;
	padding: 10px 10px 0;	
	
}
#Header .inner{
	width: 100%;
	min-width:1180px;
	padding: 30px 0;
	background:#FFF;
	transition:.3s;	
}
#Header h1{
	position: absolute;
	padding-top: 20px;
	margin-left: 77px;
	transition:.2s;
}

/* スクロール時 */
#Header.scroll{
	border-top:10px solid #4574BA;
	top:0;
	-webkit-box-shadow: 0 0 6px rgba(0,0,0,.15);
 	-moz-box-shadow: 0 0 6px rgba(0,0,0,.15);	
  	box-shadow: 0 0 6px rgba(0,0,0,.15);
	padding-top: 0;
}
#Header.scroll .inner{
	padding: 0;	
}
#Header.scroll #Gnav ul li p a{
	padding: 30px 20px;
}
#Header.scroll h1{
	padding-top: 23px;	
}
#Header.scroll h1 img{
	width: auto;
	height: 25px;	
}
@media screen and (max-width: 1260px) {
#Header h1{
	margin-left: 30px;
}
	
}

/* ---------------------------------------------------------------------------
			#Gnav	
				グローバルナビゲーション
--------------------------------------------------------------------------- */
#Gnav{
	position: relative;
	padding-right: 60px;
}
#Gnav > ul{
	float: right;
}
#Gnav ul li{
	display:inline-block;
	line-height:1;
}
#Gnav ul li.nav00{
	display:none;
}
#Gnav ul li a{
	position: relative;
	display:block;
	padding: 25px 20px;
	color:#3D3D3D;	
}
#Gnav ul li a:hover{
	color:#4574BA;	
}
#Gnav > ul > li .parent a:hover:after{
	position: absolute;
	bottom:-32px;
	left:50%;
	z-index:1000;
	margin-left: -16px;
	content:"";	
	width: 0;
	height: 0;
	border: 16px solid transparent;
	border-top:16px solid #FFF;
}
#Gnav > ul > li.current > p a,
#Gnav > ul > li.current .parent a{
	color:#4574BA;
}

@keyframes show{
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}


#Gnav .sub{
	display:none;
	position: absolute;
	left:0;
	width: 100%;
	background:#EDEDED;
	text-align:right;
}
#Gnav .sub li:first-child{
	display:none;	
}
.pcmode #Gnav ul > li:hover .sub{
	display:block;
	animation: show .4s;	
}
#Gnav .sub a{
	padding: 25px ;
	background:url(../images/common/arw_bg_w01_pc.png) no-repeat 0 center;	
}
#Gnav .nav02 .sub{ padding-right: 320px;}
#Gnav .nav03 .sub{ padding-right: 295px;}
#Gnav .nav05 .sub{ padding-right: 63px;}
#Gnav .nav06 .sub{ display:none; padding-right: 175px;}
.pcmode #Gnav .nav06:hover .sub,
#Gnav > ul > li.nav06 .parent a:hover:after{ display:none; }

/*--------------------------------------------------------------------------
   Content
---------------------------------------------------------------------------*/
#Content {
	margin-top: 140px;
	padding-bottom: 75px;
}

/*--------------------------------------------------------------------------
   layout
---------------------------------------------------------------------------*/
.layout-box{
	display:flex;
}

/*--------------------------------------------------------------------------
   btn-base
---------------------------------------------------------------------------*/
.btn-base{
	display:block;
	width: 100%;
	height: 54px;
	line-height:54px;
	text-align:center;
	color:#FFF;	
	transition:.3s;
}
.btn-base:hover{
	opacity:.7;	
}
.btn-base span{
	position: relative;
}
.btn-base span:before{
	position: absolute;
	left:-13px;
	top:50%;
	margin-top: -6px;
	content:"";
	display:block;
	width: 7px;
	height: 14px;
	background:url(../images/common/arw_btn_w01_pc.png) no-repeat;
	background-size:100% auto	
}

.btn-base.btn-w{
	color:#3D3D3D;
	background:#FFF;	
}
.btn-base.btn-w span:before{
	background:url(../images/common/arw_btn_bk01_pc.png) no-repeat;
}

.txt-link-btn span{
	padding-left: 22px;
	background:url(../images/common/arw_bg_w01_pc.png) no-repeat left center;	
}


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

/*--------------------------------------------------------------------------
   img-zoom
---------------------------------------------------------------------------*/
.img-zoom .pic,
.pic.img-zoom{
	overflow:hidden;
}
.img-zoom .pic img,
.pic.img-zoom img{
	transition:.5s;
}
.img-zoom:hover .pic img,
.pic.img-zoom:hover img{
	-webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    transform: scale(1.1);	
}


/*--------------------------------------------------------------------------
   page title
---------------------------------------------------------------------------*/
.page-ttl{
	overflow:hidden;
	position: relative;
	height: 200px;	
	padding-top: 55px;
	background:#4574BA;
}
.page-ttl:after{
	display:block;
	position: absolute;
	top:0;
	left:50%;
	z-index:1;
	margin-left: -290px;
}
.page-ttl .inner{
	position: relative;
	z-index:10;	
}

.ttl-bracket{
	font-size:122%;
	text-align:center;
	color:#4572B8;
}
.ttl-bracket span{
	position: relative;
	padding:0 20px;	
}
.ttl-bracket span:before{
	position: absolute;
	left:0;
	top:-1px;
	display:block;
	content:"";
	background:url(../images/common/blacket-left.png) no-repeat;
	width: 7px;
	height: 30px;
}
.ttl-bracket span:after{
	position: absolute;
	right:0;
	top:-1px;
	display:block;
	content:"";	
	background:url(../images/common/blacket-right.png) no-repeat;
	width: 7px;
	height: 30px;

}

/*--------------------------------------------------------------------------
   bread-crum
---------------------------------------------------------------------------*/
.bread-crum{
	padding: 10px 80px 0;
	text-align:right;	
}
.bread-crum li{
	display:inline-block;
	padding-left: 5px;
	font-size:86%;	
}
.bread-crum li:first-child{
	background:url(../images/common/ico_home.png) no-repeat left center;
	padding-left: 13px;	
}
.bread-crum li a{
	color:#4574BA;	
}
.bread-crum li+li:before{
	content:">";
	display:inline-block;
	margin-right: 5px;	
}

/*--------------------------------------------------------------------------
   intro
---------------------------------------------------------------------------*/
.intro{
	padding: 80px 0 50px;
	text-align:center;	
}
.intro .lead{
	margin-bottom: 22px;	
}
.intro .txt-lead{
	line-height:1.8;
}
.intro.middle{
	padding: 40px 0 50px;
	text-align:left;	
}


/*--------------------------------------------------------------------------
  point
---------------------------------------------------------------------------*/
.point{
	position: relative;	
	padding: 60px;
	border:1px solid #4574BA;
	
}
.point .circle{
	left:38px;
	top:-46px;
	width: 90px;	
}
.point .circle img{
	width: 100%;
	height: auto;	
}


/*--------------------------------------------------------------------------
   category nav
---------------------------------------------------------------------------*/
.cat-nav{
	padding-top: 40px;	
	border-top:1px solid #DEDEDE;
}
.cat-nav h3{
	margin-bottom: 32px;	
}
.cat-nav .cont-list{
	display:flex;	
}
.cat-nav .cont-list li{
	width: 290px;
	height: 70px;
	line-height:68px;
	border:1px solid #E4E4E4;
}
.cat-nav .cont-list li:hover,
.cat-nav .cont-list li.current{
	background:#DAE7F8;
	border:1px solid #DAE7F8;
}
.cat-nav .cont-list li+li{
	margin-left: 12px;
}
.cat-nav .cont-list li a{
	display:block;
	width: 100%;
	height: 100%;
	padding-left: 50px;
	background:url(../images/common/arw_bg_w01_pc.png) no-repeat 25px center;
	font-size:115%;
	color:#3D3D3D;	
}


/*--------------------------------------------------------------------------
   pagetop
---------------------------------------------------------------------------*/
.pagetop a{
	position:fixed;
	bottom:60px;
	right:60px;
	z-index:120;
	display:block;
	width: 60px;
	height: 60px;
	background:url(../images/common/btn_pagetop.png) no-repeat;
}
.pagetop span{
	display:none;	
}

/*--------------------------------------------------------------------------
   Footer
---------------------------------------------------------------------------*/
#Footer{
	background:#F4F4F7;
	padding: 80px 0 15px;
	
}
#Footer .info-area{
	margin-bottom: 95px;	
}
#Footer .sitemap{
	float: right;
	width: 800px;	
}
#Footer .sitemap > ul > li{
	display:inline-block;
	vertical-align:top;
}
#Footer .sitemap > ul > li.ftnav00{
	display:none;	
}
#Footer .sitemap > ul > li p{
	margin-bottom: 10px;	
}
.pcmode #Footer .sitemap > ul > li p:hover{
	opacity:.7;
}
#Footer .sitemap > ul > li p a{
	padding: 5px 25px;
	color:#4573B9;
}
#Footer .sitemap ul ul li a{
	padding: 5px 0 5px 25px;
	font-size:86%;	
	color:#3D3D3D;
}
.pcmode #Footer .sitemap ul ul li a:hover{
	color:#4573B9;
}

#Footer .ft-logo{
	margin-bottom: 12px;	
}
#Footer .address{
	margin-bottom: 20px;
	line-height:1.4;
}
#Footer .btn{
	width: 280px;
}
#Footer .btn .btn-base{
	background:#4574BA;	
}

#Footer .sub-nav{
	float: left;
	font-size:86%;	
}
#Footer .sub-nav li{
	display:inline-block;
	margin-right: 30px;	
}
#Footer .sub-nav li a{
	color:#3D3D3D;	
}
#Footer .copyright{
	float: right;
	font-size:86%;
}




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