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


/* ----------------------------------------------------
   common setting
------------------------------------------------------- */

/* basic :
--------------------------------------------*/

body{font-size: 85%;}

.outline {
    padding:  0 0.5em;
}


/* header :
--------------------------------------------*/

header#header {
    position: relative;
    z-index: 5;
    background: #fff;
}

header#header .right {
	width: 100%;
	text-align: center;
	padding: 0;
}
header#header .logo {
	padding: 0.8em 1em;
	width: 35%;
}

header#header .logo img {
	width: 90%;
}


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

	/*---- logo ----*/
	header#header .logo {
		padding: 0.6em;
		width: 50%;
	}

	header#header .logo img {
		max-width: none;
	}
	
}


/*---- nav ----*/

header#header .nav li span {display: none;}

header#header .nav li.search,
header#header .nav li.menu{display: inline;}

header#header .nav li.sns,
header#header .nav li.lang {background: none;}


header#header .nav {
	display: flex;
	justify-content: space-around;
	background: #274FA6;
}

header#header .nav li {
    padding: 0;
	position: relative;
	text-align: center;
}

header#header .nav li a {
	display: inline-block;
	padding: 1em 2em;
}

header#header .nav li img {
	display: inline-block;
    width: 2.5em;
	box-sizing: content-box;
}

header#header .nav .on img.close {
	display: inline-block;
}

header#header .nav .on img.open,
header#header .nav img.close {display: none;}

header#header .nav li.on a:after {
	content:"";
    display: block;
    height:2px;
	width: 3em;
	background: #fac028;
	position: absolute;
	bottom: 3px;
	left: 1.6em;
}

header#header .nav li.search.on a:after {
	width: 3.5em;
	left: 1.5em;
}

/*---- search ----*/

header#header #search {
	padding: 2em;
}

header#header #search,
header#header #search div {
	display: block;
	position: relative;
}

header#header #search {
	display: none;
	padding: 2em;
}

header#header #search input.txt_box {
    height: 3em;
    width: 100%;
	border-radius: 0!important;
}

header#header #search input.btn {
	position: absolute;
	right: 0em;
	border-radius: 0!important;
}

/* glnav :
--------------------------------------------*/

/*---- nav ----*/

nav#glnav {
	display: none;
	font-size: 120%;
	position: absolute;
	width: 100%;
	border-top: 1px solid #3d61af;
}

#glnav ul li a {
    width: 100%!important;
}



#glnav ul ul {display: none;}

#glnav > ul > li > a {
    float: none;
    text-align: left;
    padding: 1em 0.1em 1em 1.5em!important;
	border-top: 1px solid #6884C1;
}

#glnav > ul > li > a:after,
#glnav > ul > li > a:hover:after,
#glnav > ul > li.on > a:after {
    display: none!important;
}	

#glnav > ul > li.current > a:before {
	content:"";
    display: block;
    height: 2em;
	width: 2px;
	background: #fac028;
	position: absolute;
	left: 5px;
}

#glnav.open > ul > li.on > a {
	background-color: #3d61af;
}



/* サブメニュー */

#glnav > ul > li > ul {
    position: relative;
    padding: 0;
	display: none;
	background: rgba(39,79,166,0.95);
	top: 0px;
}

#glnav > ul > li > ul > li {
	float: none;
	width: 100%;
	margin: 0;
}

#glnav > ul > li > ul > li:first-child {border-top: 1px dotted #6884C1;}

#glnav > ul > li > ul > li > a {
    padding: 0.8em 0.5em 0.8em 2.5em;
    background: #3d61af url("../img/common/arrow4.svg") no-repeat;
    background-position: top 1.5em left 0.5em;
    background-size: 1em;
	border: none;
	border-bottom: 1px dotted #6884C1;
}

#glnav > ul > li > ul > li:nth-child(3n + 1) {
	float: none;
}

#glnav > ul > li > ul ul {
	background: #fff;
	margin: 0;
	padding: 1em;
}

#glnav > ul > li > ul ul a {
	color: #000;
}


/* footer :
--------------------------------------------*/

#footer .logo img {
    width: 7em;
}

/*---- contact ----*/

#footer .contact {
	margin: 0 0 1em;
}
#footer .contact li {
	background-position: left 1.2em center;
	background-size: 1.7em;
}

#footer .contact li a {
	padding: 1em 1em 1em 3.2em;
	background-position: right 0.5em bottom 0.5em!important;
    background-size: 1em!important;
	margin: 1em 0.2em;
	min-width: 11em;
}


/*---- footer nav ----*/

#footer {overflow: hidden;}

#footer .nav {
	padding: 1em 0;
}

#footer .nav li a {display: inline-block;}


/*---- copy ----*/

#copy {
    padding: 1em 3em 1em 1em;
}

#copy a#page_top {
	top: 0.9em;
}


/* element :
--------------------------------------------*/


/*---- btn ----*/

.btn1,
.btn2 {
	margin: 2em auto;
}

.btn1 a,
.btn2 a {
	width: 100%;
}

.btn2 a {
	padding: 1em;
}


/* frexible grid system :
--------------------------------------------*/

.grid_1_4:nth-child(2n+1) {
	margin-left: 0;
    clear: both;
    float: left;
}

.grid_1_4 { width: 48.5%; }

.grid_1_3 {
	width: 48.5%;
	margin-bottom: 1em;
}

.grid_1_3:nth-child(3n+1){
	clear: none;
	margin-left: 3%;
}

.grid_1_3:nth-child(2n+1) {
	clear: both;
	float: left;
	margin-left: 0;
}


.off .grid_1_4,
.off .grid_1_3,
.off .grid_1_2,
.off .grid_2_3,
.off .grid_3_4,
.off .grid_1_4:first-child,
.off .grid_1_3:first-child,
.off .grid_1_2:first-child,
.off .grid_2_3:first-child,
.off .grid_3_4:first-child { 
	float: none;
	margin-left: 2%;
}


.off .grid_1_4,
.off .grid_1_3,
.off .grid_1_2,
.off .grid_2_3,
.off .grid_3_4 {width: 96%;}


/* IE11 :
--------------------------------------------*/



@media all and (-ms-high-contrast:none){
	*::-ms-backdrop, #header .nav li.menu img,
	*::-ms-backdrop, #header .nav li.lang img,
	*::-ms-backdrop, #header .nav li.search img {width: 70px!important;height: 30px!important;}
}