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

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

	common css

------------------------------------------------------*/
*, *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
html { width: 100%; overflow: scroll; font-size: 10px; }
body { font-family: "游ゴシック Medium", 游ゴシック体, "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color: #333; line-height: 1.5; background-color: #fff; overflow: hidden; }
.container { width: 100%; margin-left: auto; margin-right: auto; position: relative; }
ul { list-style: none; }
ol { list-style: decimal; }
img { vertical-align: bottom; width: auto; max-width: 100%; height: auto; }
/*a:link { color: #000; text-decoration: none; }
a:visited { color: #000; }*/

/*a.fade:hover { text-decoration: none; background-color: #fff; color: #333; -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }*/
a.fade:hover ,
a.fade:hover * { text-decoration: none; -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }

.pc { display:block; }
.sp { display:none; }

.text { font-size: 1.6rem; line-height: 1.8; }
.text .red { color: #890202; }

.font-02 { font-family: 'Noto Serif JP',"ヒラギノ明朝 ProN W3", "Hiragino font-02 ProN", 游明朝, Yufont-02, HG 明朝E, "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; }
.font-tel { font-family: 'Oswald', sans-serif; font-weight: 500; }
.font-01 { font-family: "游ゴシック Medium", 游ゴシック体, "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; }
.font-03 { font-family: "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic","游ゴシック Medium", 游ゴシック体, "Yu Gothic Medium", YuGothic, sans-serif; }

/* インデントありテキスト */
/* 1文字分右へ */
.indent { text-indent: 1em; }
/* 1文字分左へ */
.indent-1 { text-indent: -1em; padding-left: 1em; }

main { display: block; }

@media (min-width: 768px) {
	body{ min-width: 1100px; }
	.container { max-width: 1100px; }

	a:hover { text-decoration: underline; }
	a img:hover { opacity: 0.8; -webkit-transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 400ms cubic-bezier(0.165, 0.84, 0.44, 1); }
}

@media screen and (min-width:768px) and ( max-width:1100px) {
    header .container ,
    footer .container { width: -webkit-calc(100% - 40px); width: calc(100% - 40px); }
}

@media (max-width: 767px) {

	.container { margin-left: 20px; margin-right: 20px; width: auto; }
	.pc { display: none; }
	.sp { display: block; }

    .text { font-size: 1.5rem; }
}

@media (max-width: 480px) {
	.container { margin-left: 15px; margin-right: 15px; }
}


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

	flexbox

------------------------------------------------------*/
.colWrap { display: flex; display: -webkit-flex; flex-direction: row; -webkit-flex-direction: row; flex-wrap: wrap; -webkit-flex-wrap: wrap; justify-content: space-between; -webkit-justify-content: space-between; align-items: stretch; -webkit-align-items: stretch; align-content: stretch; -webkit-align-content: stretch; }

.col2-1 { width: 50%; width: -webkit-calc(50% - 10px); width: calc(50% - 10px); }
.col3-1 { width: 33.3%; width: -webkit-calc(99.9% / 3 - 10px); width: calc(99.9% / 3 - 10px); }
.col4-1 { width: -webkit-calc( 25% - 10px ); width: calc( 25% - 10px ); }

.colWrap .img { text-align: center; }
.colWrap .img img { width: auto; max-width: 100%; }

.col3L1 ,
.col3R1 { width: 33.3%; width: -webkit-calc(99.9% / 3 - 10px); width: calc(99.9% / 3 - 10px); }
.col3L2 ,
.col3R2 { width: 66.6%; width: -webkit-calc( 99.9% * 0.666 - 10px ); width: calc( 99.9% * 0.666 - 10px ); }

.flex-left { justify-content: flex-start; -webkit-justify-content: flex-start; }
.flex-right { justify-content: flex-end; -webkit-justify-content: flex-end; }
.flex-align-center { align-items: center; -webkit-align-items: center; }
.flex-center { justify-content: center; -webkit-justify-content: center; }


@media (max-width: 767px) {

	.col2-1 { width: 100%; }
	.col3-1 { width: 50%; width: -webkit-calc(50% - 10px); width: calc(50% - 10px); }
	.col4-1 { width: 50%; width: -webkit-calc(50% - 10px); width: calc(50% - 10px); }

	.col3L1 ,
	.col3R1 ,
	.col3L2 ,
	.col3R2 { width: 100%; margin-bottom: 15px; }

	.col2-1:first-child { margin-bottom: 15px; }
}



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

    pageTop

------------------------------------------------------*/
#page-top { position:fixed; bottom:60px; right:20px; font-size:1.4rem; z-index:999; }
#page-top a { background: #444a9c; text-decoration: none; color:#444a9c; width:55px; height: 55px; line-height: 55px; text-align:center; display: block; position: relative; z-index: 1;}
#page-top a::before { content: ''; position: absolute; width: 66%; height: 66%; border-radius: 50%; background-color: #fff; z-index: -1; left: 0; right: 0; top: 0; bottom: 0; margin: auto; }

@media (min-width: 768px) {
    #page-top a:hover { opacity: 0.8; }
}

@media (max-width: 767px) {

}



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

    header

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


header #menuBtn { width: 43px; height: 43px; position: absolute; right: 0; top: 0; background-color: #444a9c; z-index: 10; }
header #menuBtn span { display: inline-block; transition: all .2s; box-sizing: border-box; }
header #menuBtn span { position: absolute; left: 0; right: 0; width: 75%; height: 1px; background-color: #fff; border-radius: 4px; margin-left: auto; margin-right: auto; }
header #menuBtn span:nth-of-type(1) { top: 10px; }
header #menuBtn span:nth-of-type(2) { top: 32px; }
header #menuBtn span:nth-of-type(3) { bottom: 21px; }

header #menuBtn span:nth-of-type(1) { -webkit-animation: menu-bar01 .2s forwards; animation: menu-bar01 .2s forwards; }
@-webkit-keyframes menu-bar01 {
  0% {
    -webkit-transform: translateY(11px) rotate(45deg);
  }
  50% {
    -webkit-transform: translateY(6px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(0) rotate(0);
  }
}
@keyframes menu-bar01 {
  0% {
    transform: translateY(11px) rotate(45deg);
  }
  50% {
    transform: translateY(6px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}
header #menuBtn span:nth-of-type(2) { transition: all .15s .15s; opacity: 1; }
header #menuBtn span:nth-of-type(3) {
-webkit-animation: menu-bar02 .2s forwards; animation: menu-bar02 .2s forwards; }
@-webkit-keyframes menu-bar02 {
  0% {
    -webkit-transform: translateY(0px) rotate(-45deg);
  }
  50% {
    -webkit-transform: translateY(-4px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(0) rotate(0);
  }
}
@keyframes menu-bar02 {
  0% {
    transform: translateY(0px) rotate(-45deg);
  }
  50% {
    transform: translateY(-4px) rotate(0);
  }
  100% {
    transform: translateY(0) rotate(0);
  }
}
header #menuBtn.active span:nth-of-type(1) { -webkit-animation: active-menu-bar01 .2s forwards; animation: active-menu-bar01 .2s forwards; }
@-webkit-keyframes active-menu-bar01 {
  0% {
    -webkit-transform: translateY(0) rotate(0);
  }
  50% {
    -webkit-transform: translateY(6px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(11px) rotate(45deg);
  }
}
@keyframes active-menu-bar01 {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(6px) rotate(0);
  }
  100% {
    transform: translateY(11px) rotate(45deg);
  }
}
header #menuBtn.active span:nth-of-type(2) { opacity: 0; }
header #menuBtn.active span:nth-of-type(3) { -webkit-animation: active-menu-bar03 .2s forwards; animation: active-menu-bar03 .2s forwards; }
@-webkit-keyframes active-menu-bar03 {
  0% {
    -webkit-transform: translateY(0) rotate(0);
  }
  50% {
    -webkit-transform: translateY(-4px) rotate(0);
  }
  100% {
    -webkit-transform: translateY(0px) rotate(-45deg);
  }
}
@keyframes active-menu-bar03 {
  0% {
    transform: translateY(0) rotate(0);
  }
  50% {
    transform: translateY(-4px) rotate(0);
  }
  100% {
    transform: translateY(0px) rotate(-45deg);
  }
}



@media (min-width: 768px) {


}

@media (max-width: 767px) {


}

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



------------------------------------------------------*/
#menuBtn + nav { background-color: rgba(255,255,255,0.7); position: absolute; width: 100%; z-index: 2; left: 0; top: 0; padding-top: 60px; -moz-transform: translateY(-280px); -webkit-transform: translateY(-280px); -o-transform: translateY(-280px); -ms-transform: translateY(-280px); -webkit-transition: all 600ms cubic-bezier(0.165, 0.84, 0.44, 1); transition: all 600ms cubic-bezier(0.165, 0.84, 0.44, 1); }
#menuBtn + nav ul {  border-top: 1px solid #fff; }
#menuBtn + nav ul li { width: 100%; font-size: 1.6rem; text-align: center;}
#menuBtn + nav ul li:not(:last-child) { border-bottom: 1px solid #fff;}
#menuBtn + nav ul li a { display: block; height: 100%; padding: 15px 10px; color: #1b1464; text-decoration: none;}

#menuBtn + nav.open { -moz-transform: translateY(0px); -webkit-transform: translateY(0px); -o-transform: translateY(0px); -ms-transform: translateY(0px); }

@media (min-width: 768px) {
    
    #menuBtn { display: none;}

}

@media (max-width: 767px) {
    
    #menuBtn + nav ul li a { padding: 10px;}
}



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

    footer

------------------------------------------------------*/
footer { background-color: #444a9c; color: #fff;}
footer .container {}
footer div.colWrap {}
footer div.colWrap nav {}
footer div.colWrap ul.colWrap {}
footer div.colWrap ul li { font-size: 1.6rem; text-align: center; border-bottom: 2px solid #fff; border-top: 4px solid #fff; padding: 18px 5px 12px; position: relative;}
footer div.colWrap ul li::before { content: ''; border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 8px solid #fff; position: absolute; top: 0; left: 0; right: 0; margin: auto; width: 10px; height: 10px; }
footer div.colWrap ul li a { color: #fff; text-decoration: none;}
footer div.colWrap nav+div {}
footer div.colWrap .logo { margin-bottom: 10px;}
footer div.colWrap .logo a {}
footer div.colWrap .logo img { width: 100%; max-width: 308px;}
footer div.colWrap .logo + p { font-size: 1.3rem;}

#copy { text-align: center; padding: 5px;}


@media (min-width: 768px) {
    footer { padding-top: 75px; padding-bottom: 30px; margin-top: -184px;}
    footer div.colWrap { margin-bottom: 45px;}
    footer div.colWrap nav { width: calc((100% - 436px) - 50px);}
    footer div.colWrap ul li { width: 256px; }
    footer div.colWrap ul li:first-child { margin-right: 60px;}
    footer div.colWrap ul li a:hover { text-decoration: underline;}
    footer div.colWrap nav+div { width: 436px; padding-left: 80px;}

}

@media (max-width: 767px) {
    footer { padding-top: 60px; padding-bottom: 20px; margin-top: -130px;}
    footer div.colWrap { margin-bottom: 35px;}
    footer div.colWrap nav { width: 100%; margin-bottom: 50px;}
    footer div.colWrap ul.colWrap { display: block;}
    footer div.colWrap ul li { width: 100%; max-width: 256px; margin-left: auto; margin-right: auto;}
    footer div.colWrap ul li:first-child { margin-bottom: 30px;}
    footer div.colWrap nav+div { width: 100%; text-align: center;}

}