@charset "euc-jp";
body {
	margin: 0;
	padding: 0;
	font-family: 'Noto Sans JP', "Yu Gothic", YuGothic, "¥Ò¥é¥®¥Î³Ñ¥´ Pro", "Hiragino Kaku Gothic Pro", "¥á¥¤¥ê¥ª", "Meiryo", sans-serif;
	font-size:100%;
	line-height:180%;
    letter-spacing: 1px;
	color: #03040c;
}
img { border: none; vertical-align:bottom;}
div, p, ul, ul li, h1, h2, h3, h4, h5, dl, dt, dd {
	margin: 0; padding: 0;
	font-size: 100%;
	list-style:none;
	box-sizing:border-box;
}
div, p, ul, ul li, h1, h2, h3, h4, h5, dl, dt, dd, ol, ol li, table, th, td {
	background-image:url(../image/spacer.gif);
}
iframe { border: none;}
a:link {color:#06F; outline:none; }
a:visited {color:#06F;}
a:hover {color: #333;}
a:hover img { opacity: 0.7; filter: alpha(opacity=70);}
#wrapper {}
i.material-icons { vertical-align: middle;}
.pc {display:block;}
.sp {display:none;}

#content { position:relative;}
#content::before { position:relative; transition:.3s; opacity: 0;}
#content.pull_bg::before { 
    display: block; clear: both; content:""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 1; background:rgba(0,0,0,0.5); 
    z-index: 99999;
}
@media only screen and (max-width:800px){
	body { min-width:420px; font-size:100%;}
	#header { width:100%;}
	#content{ width:100%;}
	#footer { width:100%;}
	#wrapper { background:#fff; border-top:none; overflow:hidden;}
	#base { width:100%; margin:0 !important;}
	.pc { display:none !important;}
	.sp { display:block !important;}
}


/*====================================================================================================
  HEADER
====================================================================================================*/
#header {}

/* MAINIMG */
#header .mainimg { position: relative; overflow-x: hidden;}
#header h1 {
	position: absolute; top: 0; left: 0;
	margin:auto; z-index: 9999;
	background: url("../img/sang_w.png") no-repeat center bottom;
	background-size: 100% auto;
}
#header h1 a { 
	position: absolute;
	top: 0; left: 0; right: 0; bottom: 0;
	display: block; margin: auto; width: 250px; height:250px;
	text-indent: -9999px;
	background: url("../img/logo_w.svg") no-repeat center center;
	background-size: 100% auto;
}
#header h1,
#header .mainslider img {
	width: 100vw; height: 80vh; object-fit: cover;
}

/* NAV */
#header #nav { position: relative; clear: both;}
#header #nav ul {
	margin:0 auto;
	padding: 20px 0;
	width: 96%;
	max-width: 720px;
	text-align: center;
}
#header #nav ul li { float: left; width: 20%;}
#header #nav ul li a { position: relative; }
#header #nav ul li a:hover { opacity: 0.7;}
#header #nav ul li a { 
    display:block;
	padding:75px 0 5px; 
    font-family: 'Noto Serif JP', serif;
    color:#074f83;
    font-size:112.5%;
    font-weight: 500;
    text-align: center;
    text-decoration: none;
    background-size:60px auto !important;
    box-sizing: border-box;
}
#header #nav ul li:nth-child(1) a { background: url("../img/nav1.png") no-repeat center 15px;}
#header #nav ul li:nth-child(2) a { background: url("../img/nav2.png") no-repeat center 15px;}
#header #nav ul li:nth-child(3) a { background: url("../img/nav3.png") no-repeat center 15px;}
#header #nav ul li:nth-child(4) a { background: url("../img/nav4.png") no-repeat center 15px;}
#header #nav ul li:nth-child(5) a { background: url("../img/nav5.png") no-repeat center 15px;}
@media only screen and (max-width:800px){
	#header #nav { display: none;}
}    


/*====================================================================================================
  CONTENT
====================================================================================================*/
#content { clear:both;}


/*====================================================================================================
  FOOTER
====================================================================================================*/
#footer {
	clear:both;
	padding-top: 60px;
	font-family: 'Noto Serif JP', serif;
}
#footer .logo {
	margin: auto;
	width: 185px; height: 185px;
	text-indent: -9999px;
	background: url("../img/logo_b.svg") no-repeat;
	background-size: 100% auto;
}

#footer .add {
	padding:20px 0 60px;
	text-align: center;
	color: #fff;
	font-size: 87.5%;
	color: #074f83;
	background: url("../img/wave_ba.png") no-repeat center bottom;
	background-size: 100% auto;
}
#footer .copy {
	padding: 10px 0;
	font-size: 75%;
	text-align: center;
	color: #fff;
	background: #074f83;
}
@media only screen and (max-width:800px){
	#footer .copy { padding-bottom: 85px;}
} 


/*====================================================================================================
  FIX CONTENT
====================================================================================================*/
#page,
#page a { display:block; width:60px; height:60px;}
#page { position: fixed; bottom:20px; right:20px; z-index: 999999; transition: .3s;}
#page a { text-indent: -9999px; background:#074f83 url(../img/page_top.png) no-repeat; background-size: 100% auto;}
#page:hover { bottom:40px; opacity: 0.7;}
#fix_cont { display: none;}
@media only screen and (max-width:800px){
    #page,
    #page a { display:block; width:35px; height:35px;}
    #page { bottom:90px;}
    #fix_cont { 
		position: fixed; left: 0; bottom: 0;
		display: block; padding: 0 25px; width: 100%;
		background: #fff;
		box-shadow: 0 0 5px 0 rgba(0, 0, 0, 0.15);
		z-index: 99999;
	}
    #fix_cont li { float: left; width: 20%;}
    #fix_cont li a { 
        display:block; padding: 55px 0 5px; height: 95px;
		font-family: 'Noto Serif JP', serif;
        color:#074f83; font-size:87.5%; text-align: center; text-decoration: none;
        letter-spacing: 0;
        background-size: 40px auto !important;
        box-sizing: border-box;
    }
    #fix_cont li:nth-child(1) a { background: url("../img/nav1.png") no-repeat center 15px;}
    #fix_cont li:nth-child(2) a { background: url("../img/nav2.png") no-repeat center 15px;}
    #fix_cont li:nth-child(3) a { background: url("../img/nav3.png") no-repeat center 15px;}
    #fix_cont li:nth-child(4) a { background: url("../img/nav4.png") no-repeat center 15px;}
    #fix_cont li:nth-child(5) a { background: url("../img/nav5.png") no-repeat center 15px;}
}



/*====================================================================================================
  COLOR eto..
====================================================================================================*/
.light-blue { color: #40A6DD;}
.blue { color: #0000FF;}
.dark-blue { color: #000099;}
.purple { color: #660099;}
.pink { color: #FF6699;}
.red { color: #FF0000;}
.orange { color: #FF6600;}
.yellow { color: #FFCC00;}
.white { color: #FFFFFF;}
.gray { color: #666666;}
.brown { color: #663300;}
.green { color: #339900;}
.italic { font-style: italic;}
.strong { font-weight: bold;}
.large { font-size: 115%; line-height: 140%;}
.small { font-size: 80%;}
.underline { text-decoration: underline;}
.line-through { text-decoration: line-through;}
.left { text-align: left;}
.center { text-align: center;}
.right { text-align: right;}



/* add */
.hide{
	display:none;
}

.image_center{
	text-align:center;
}