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

/*  Reset

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

html {
	overflow-y	: scroll;
	height		: 100%;
	font-size	: 62.5%;
	-webkit-text-size-adjust: 100%;
}

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,p,blockquote {
	margin 	: 0;
	padding : 0;
}

fieldset {
	display	: inline;
}

address,caption,cite,code,dfn,em,strong,th,var {
	font-style : normal;
}

body/**/table {
	line-height	: 1.5;
}

q:before,
q:after {
	content : '';
}

object,embed {
	vertical-align : top;
}

hr,legend	{
	display : none;
}

/*h1,h2,h3,h4,h5,h6 {
	font-size : 100%;
}*/

img,abbr,acronym,fieldset {
	border : 0;
}

li {
	list-style-type : none;
}

img[usemap] {
	border		: none;
	height		: auto;
	max-width	: 100%;
	width		: auto;
}

img {
	border		: 0;
	max-width	: 100%;
	height: auto;
}

i {
	padding : 5px 10px 2px 0;
}

p {
	overflow-wrap: break-word;
	word-wrap: break-word;
}

/* Flexible Images */
img{
    max-width	: 100%;
    height		: auto;
    width /***/	: auto;
}

submit	{ -webkit-appearance : none;}

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

/*  Basic Style

/* ------------------------------------------------------------------------ */
@media print{
	header{
		display: none;
	}
	
	body {
		zoom: 0.7;
		-webkit-print-color-adjust: exact;
	}
}


body {
	margin		: 0;
	padding		: 0;
	height		: 100%;
	font-family	: 'Noto Sans JP','Oswald','ヒラギノ角ゴ W3', "メイリオ", Meiryo, MS PGothic, arial, sans-serif;
	font-size	: 1.4rem;
	font-size	: 14px;
	line-height	: 1.8;
	color		: #000922;
	-webkit-text-size-adjust	: 100%;
	font-smoothing	: auto;
	width: 100%;
	box-sizing: border-box;
	overflow-wrap: break-word;
	word-wrap: break-word;
}

body *{
	box-sizing: border-box;
}

#wrap{
	margin		: 0 auto;
	text-align	: center;
}

body > #wrap { height : auto;}

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

.content {
	max-width: 1100px;
	width: 100%;
	margin: 0 auto;
	position: relative;
}

@media screen and (max-width: 1300px){
	.content{
		padding: 0 20px;
	}
}


/* Link
--------------------------------------------------------------------------- */

.opacity a:hover img{
	opacity: 0.85;
}

a:visited	{
	text-decoration	: none;
}

a:hover	{
	color			: #000922;
	text-decoration	: underline;
}


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

/* Hedaer

/* ------------------------------------------------------------------------ */
#top-head .inner{
	display: flex;
	justify-content: space-between;
    position: absolute;
    max-width: 1600px;
    width: 100%;
    z-index: 1;
}

#top-head .inner #mobile-head{
	margin-left: 80px;
	margin-top: 8px;
}

#top-head .inner .logo{
    display: none;
	padding: 20px;
}

#top-head .inner .right-box > div{
	background: #062f71;
	width: 180px;
}

#top-head .inner .right-box > div a{
	display: block;
	padding: 16px 10px;
	color: #fff;
	font-family: 'Oswald', sans-serif;
	font-size: 24px;
	font-weight: 700;
	letter-spacing: 2px;
}
#top-head .inner .right-box > div a span{
	font-family: 'Noto Sans JP', sans-serif;
	display: block;
	color: #fff;
	font-size: 13px;
	font-weight: 400;
}

#top-head .inner .right-box > div a:hover{
	opacity: 0.8;
	text-decoration: none;
}

/* Fixed */
#top-head.fixed {
	margin-top: 0;
	top: 0;
	position: fixed;
	background: #fff;
	z-index: 999;
	width: 100%;
	box-shadow: 0px 10px 10px -5px rgba(0,0,0,0.2);
	max-width: 1600px;
}
#top-head.fixed .logo {
    display: block;
	width: 70%;
	transform: scale(0.9);
}

#top-head.fixed .inner .right-box > div a{
	font-size: 20px;
	padding: 11px;
}

@media screen and (max-width: 1300px){
	#top-head .inner #mobile-head{
		margin-left: 0px;
		margin-top: 0px;
	}
}

@media screen and (max-width: 768px){
	#top-head .inner .logo {
		padding: 20px;
		width: 70%;
	}
}

@media screen and (max-width: 478px){
	#top-head .inner .right-box > div{
		width: 155px;
	}
	
	#top-head.fixed .inner .right-box > div a{
		font-size: 16px;
	}
	
	#top-head .inner .right-box > div a{
		padding: 10px;
	}
	
	#top-head .inner .logo{
		width: 70%;
	}
	
}
/* ------------------------------------------------------------------------ */

/* Footer

/* ------------------------------------------------------------------------ */
footer{
	max-width: 1600px;
	background: #062f71;
	margin: 60px auto 0;
}

footer .footer-inner{
	padding: 101px 40px 50px;
}

footer p{
	color: #fff;
	font-size: 13px;
	padding-bottom: 20px;
	letter-spacing: 1px;
}

footer p.footer-txt{
	color: #fff;
	font-size: 18px;
    padding-bottom: 40px;
}
footer p.footer-txt a{
	color: #fff;
	text-decoration: underline;
}
footer p.footer-txt a:hover{
	text-decoration: none;
}

footer .flex{
	align-items: center;
}


footer p.footer-logo{
	padding: 0 20px 20px;
}


@media screen and (max-width: 478px){
	footer .footer-inner {
		padding: 60px 40px 20px;
	}
	
	footer p{
		padding-left: 10px;
		padding-right: 10px;
		font-size: 12px;
		line-height: 1.6;
	}
	
	footer .flex{
		display: block;
	}
	
	footer p.footer-logo{
		padding: 0 0px 40px;
	}
	footer p.footer-logo + p.footer-logo{
		padding: 0 0 20px;
	}
}

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

/* スマホ

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

@media screen and (max-width: 768px){
	.inner{
		max-width: 750px;
		width: 100%;
		margin: 0 auto 70px;
		padding: 0 20px;
	}
	
	#top-head .inner{
		align-items: center;
		max-width: 768px;
		height: inherit;
		margin: 0;
		padding: 0;
	}
	
	.main_title{
		padding: 45px 0;
		margin-bottom: 45px;
	}
	h2{
		font-size: 2.0rem;
		font-weight: 400;
	}
	.crumb_sp_wrapper{
		display: block;
	}
}


/*----------------------------------------------*/
/*アニメーション*/
/*----------------------------------------------*/
.img-fade-left,
.img-fade-right,
.img-fade {
	-webkit-transition: all 1s;
    -moz-transition: all .1s;
    transition: all 1s;
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity:0;
	position: relative;
}

.img-fade-low {
	-webkit-transition: all 1s;
    -moz-transition: all 1s;
    transition: all 1s;
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity:0;
}

.fade-act {
	opacity: 1;
	filter: alpha(opacity=100);
	-moz-opacity:1;
}

.img-ride {
	overflow: hidden;
	position: relative;
}

.img-ride a.bnr,
.img-ride .show-in,
.img-ride img {
	opacity: 0;
	filter: alpha(opacity=0);
	-moz-opacity:0;
}

.img-ride::after {
	position: absolute;
	content: "";
	width: 100%;
	height: 100%;
	display: inline-block;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#232323+0,143284+100 */
	background: #232323; /* Old browsers */
	background: -moz-linear-gradient(left,  #232323 0%, #143284 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #232323 0%,#143284 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #232323 0%,#143284 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#232323', endColorstr='#143284',GradientType=1 ); /* IE6-9 */
	-webkit-transition: all .3s;
    -moz-transition: all .3s;
    transition: all .3s;
	left: -100%;
	top:0;
}

.img-ride.fade-act::after {
	animation: c-color 1s ease-in-out 1;
	-webkit-animation: c-color 1s ease-in-out 1;
	left: -130%;
	z-index: 100;
}

@-webkit-keyframes c-color {
	0% { left: -100%; }
	50% { left: 0%; }
	100% { left: 100%; }
}
@keyframes c-color {
	0% { left: -100%; }
	50% { left: 0%; }
	100% { left: 100%; }
}

.img-ride.fade-act a.bnr,
.img-ride.fade-act .show-in,
.img-ride.fade-act img {
	animation: c-fade 1s ease-out .5s 1 forwards;
	-webkit-animation: c-fade 1s ease-out .5s 1 forwards;
}

@-webkit-keyframes c-fade {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes c-fade {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

.img-ride.fade-end a.bnr,
.img-ride.fade-end .show-in,
.img-ride.fade-end img {
	animation: c-fade-end 1s ease-out 1 forwards;
	-webkit-animation: c-fade-end 1s ease-out 1 forwards;
}

@-webkit-keyframes c-fade-end {
	0% { opacity: 1; }
	100% { opacity: 0; }
}
@keyframes c-fade-end {
	0% { opacity: 1; }
	100% { opacity: 0; }
}