@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400..700&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Yomogi&display=swap');
@import url("https://use.typekit.net/odk2jzs.css");

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: normal;
  src: url("../fonts/YakuHanJP-Regular.woff2") format("woff2"),
    url("../fonts/YakuHanJP-Regular.woff") format("woff");
}

@font-face {
  font-family: "YakuHanJP";
  font-style: normal;
  font-weight: bold;
  src: url("../fonts/YakuHanJP-Bold.woff2") format("woff2"),
    url("../fonts/YakuHanJP-Bold.woff") format("woff");
}

html { overflow-y:scroll; font-size: 62.5%}
ol, ul, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, h7, form, p { margin:0; padding:0; }
img { border:0; }
li { list-style-type:none; }

body {
  width:100%; margin:0; padding:0;
  font-size: 1.6em; line-height:1.5;
  color:#1E1E1E;
  background: #fff;
  font-family: /*"YakuHanJP", 'Noto Sans JP', */"游ゴシック", YuGothic, "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "ＭＳ Ｐゴシック", sans-serif;
  letter-spacing: 0.05em;
  -webkit-text-size-adjust: 100%;
  background: url(/img/common/bg.jpg) top left/499px auto repeat;
}
.contents{background: url(/img/common/bg_cloud_1.png) top right/404px auto no-repeat,url(/img/common/bg_cloud_5.png) bottom left/346px auto no-repeat;}

table th, table td { font-size:14px; }

a {
  overflow:hidden;
  -webkit-transition:.2s linear;
  -moz-transition:.2s linear;
  -o-transition:.2s linear;
  transition:.2s linear; }
a:link		{ color:#1E1E1E; text-decoration:none; }
a:visited	{ color:#1E1E1E; }
a:hover		{ opacity: 0.8; }
a:active	{ opacity: 0.8; }

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

/* clearfix */
.clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0}
* html .clearfix { zoom: 1; } /* IE6 */  
*:first-child+html .clearfix { zoom: 1; } /* IE7 */  

.txt_c { text-align:center; }
.txt_l { text-align:left; }
.txt_r { text-align:right; }

.float_l { float:left; }
.float_r { float:right; }
.clear { clear:both; }

.serif { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif; }
.en { font-family: "Nunito", sans-serif;font-weight: 700;font-style: normal;letter-spacing: .03em}
.en_2 { font-family: "Caveat", cursive;font-weight: 500;font-style: normal;letter-spacing: .03em}
.bold  { font-weight:bold; }
.big   { font-size:120%; }
.small { font-size:88%; }
.red   { color:#c00; }
.mt10  { margin-top:10px; }
.mt20  { margin-top:20px; }

.shadow{box-shadow:rgba(0,0,0,.1) 10px 10px 20px 0}
.mfp-iframe-holder .mfp-close{background:#1e1e1e;width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;border-radius:100%;opacity:1;right:0}
.common_waku{position:relative;background:#66c1ec;transition:.3s}
.common_waku:hover{opacity:.7}
.common_waku:after{content:"";position:absolute;top:0;left:0;width:calc(100% - 12px);height:calc(100% - 12px);border:6px solid;border-image:url(/img/common/waku_w.svg);border-image-slice:8;pointer-events:none}

/* animation */
.reveal_text{display:inline-block;clip-path:inset(0 100% 0 0);will-change:clip-path;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;padding: 0 .1em .05em 0;}
.reveal_text.animated {animation: text-reveal 0.9s ease-out forwards;}

@keyframes text-reveal {
  to { clip-path: inset(0 0 0 0); }
}
@media (prefers-reduced-motion: reduce) {
  .reveal_text { animation: none !important; clip-path: inset(0 0 0 0); }
}

#loader-bg {display: none; position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; background-color: #fff; z-index:10000;}
#loader {display: none; position: absolute; top: 0%; left: 0%; width: 100%; height: 100%; text-align: center; z-index: 100;}

/* loader_box */
.loader_box{position: relative; display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;}
.loader_box .inner{width:95%;max-width:320px;position:relative;margin-left:5%}
.loader_box .loader_logo{animation:flip 2s ease-in-out infinite;transform-origin:center;position: relative}
.loader_box .loader_logo .wing{position: absolute;top:0;right: 0;width:27%; transform-origin: left bottom;animation: flap 2s ease-in-out infinite;}

@keyframes flip {
  0% {
    transform: rotateY(0deg);
  }
  40% {
    transform: rotateY(360deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}

@keyframes flap {
  0% {
    transform: rotate(0deg);
  }
  40% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(-20deg);
  }
  60% {
    transform: rotate(0deg);
  }
  70% {
    transform: rotate(-20deg);
  }
  80% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(0deg);
  }
}


/* header */
.header{position:relative;width:100%;background:#fff;overflow:hidden;}
.header_inner{display:flex;justify-content:space-between;align-items:center;width:100%;margin:0 auto;padding:16px 20px 17px;z-index:1;position:relative;max-width:1500px;box-sizing: border-box}
.header_menu{width:calc(50% + 150px);transition:.5s;position: relative}
.header_nav{position:relative;transition:.5s}
.header_nav ul{display:flex;justify-content:flex-end;flex-wrap:wrap;max-width:100%}
.header_nav ul li{font-size:1.8rem;font-weight:700;text-align:center;}
.header_nav ul+ul li{}
.header_nav ul li+li{margin-left:.5em}
.header_nav ul li a{display:inline-block;line-height: 1;padding: 0 10px 4px 3px;position: relative;}
.header_nav ul li a:after{content: "";position: absolute;width:0;height:12px;bottom: 0;left: 0;background: url(/img/common/line_8.svg) bottom left / 100% auto no-repeat;transition: .3s;z-index: -1}
.header_nav ul li a:hover{opacity: 1}
.header_nav ul li a:hover:after,.header_nav ul li.current a:after{width:100%;}
.header_nav ul li:nth-of-type(1) a:after {background-image: url(/img/common/line_1.svg);}
.header_nav ul li:nth-of-type(2) a:after {background-image: url(/img/common/line_2.svg);}
.header_nav ul li:nth-of-type(3) a:after {background-image: url(/img/common/line_3.svg);}
.header_nav ul + ul li:nth-of-type(1) a:after {background-image: url(/img/common/line_4.svg);}
.header_nav ul + ul li:nth-of-type(2) a:after {background-image: url(/img/common/line_5.svg);}
.header_nav ul + ul li:nth-of-type(3) a:after {background-image: url(/img/common/line_6.svg);}
.header_nav ul + ul li:nth-of-type(4) a:after {background-image: url(/img/common/line_7.svg);}
.header_nav ul + ul li:nth-of-type(5) a:after {background-image: url(/img/common/line_8.svg);}
.header .header_sns{margin-top:4px;transition:.5s}
.header_sns ul{display:flex;justify-content:flex-end}
.header_sns ul li+li{margin-left:1em}
.header_sns ul li a{display:flex;align-items:center;justify-content:center;width:18px;height:20px}
.header_sns ul li img{width:100%;height:auto}
.header,.header_inner,.header_logo,.header_nav,.header_sns{transition:all .3s ease;-webkit-transition:all .3s ease;-moz-transition:all .3s ease;-o-transition:all .3s ease}
.header_logo{width:150px}
.header_nav_toggle{display:none;position:absolute;right:0;top:0;width:60px;height:60px;cursor:pointer;z-index:10;background:#00a1f0}
.header_nav_toggle>div{width:26px;height:19px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}
.header_nav_toggle span{display:block;position:absolute;height:2px;width:100%;background:#fff;left:0;-webkit-transition:.35s ease-in-out;-moz-transition:.35s ease-in-out;transition:.35s ease-in-out;border-radius:3px}
.header_nav_toggle span:first-child{top:0}
.header_nav_toggle span:nth-child(2){top:calc(50% - 2px)}
.header_nav_toggle span:nth-child(3){top:calc(100% - 3px)}
.header_nav_toggle:after{content:none;color:#fff;font-family:marvin-round,sans-serif;font-weight:400;font-style:normal;font-size:1rem;position:absolute;bottom:12px;left:50%;transform:translateX(-50%)}
.header.fixed{position:fixed;top:0;z-index:10;}

@media (min-width: 681px) {
.header.fixed{background:#fff}
.header.fixed .header_inner{padding:12px 20px;box-sizing: border-box;align-items:center}
.header.fixed>.header_curtain{top:-100%}
.header.fixed .header_logo{width:120px}
.header.fixed .header_menu{width:auto;margin:0}
.header.fixed .header_nav{top:0}
.header.fixed .header_sns{display:none}
.header_nav ul + ul {margin-top: .25rem;}
.header .header_sns {padding-right: 10px;}
}

.contents{padding:50px 20px 20px;text-align:left}
.contents p{margin-bottom:1em}
.contents p:last-child{margin-bottom:0}
.footer{padding:70px 20px 70px;letter-spacing:.09em;position:relative}
.footer_inner{text-align:center}
.footer_logo{width:150px;margin:0 auto 50px}
.footer_logo img {width: 90%;margin-left: 10%;}
.footer_sns{display:flex;justify-content:center}
.footer_sns li a{display:flex;align-items:center;justify-content:center;width:26px;height:30px}
.footer_sns li+li{margin-left:1em}
.footer_sns li img{width:100%;height:auto}
.footer_copy{font-size:1.5rem;color:#fff;margin-top:3rem}

.fadein {opacity: 0.1; transform: translate(0, 50px); transition: all 500ms;}
.fadein.scrollin {opacity: 1; transform: translate(0, 0);}

.section {position: relative;}
.section_inner {position: relative; width: 1240px; margin: 0 auto;}


/* PC（1400px以下） */
@media (min-width: 1080px) {
  #contents { width:1060px; margin:auto; padding:0; }
}
@media (max-width: 1400px) {
  .header_inner {width: 100%; padding-left: 2%; padding-right: 2%; box-sizing: border-box;}
  .header_logo {/*width: 26%;*/}

  .header.fixed .header_inner {width: 100%; padding-left: 2%; padding-right: 2%;}
}
@media (max-width: 1300px) {
  .section_inner {width: 100%; padding-left: 2%; padding-right: 2%; box-sizing: border-box;}
}

/* タブレット */
@media (max-width: 1080px) {
  .header_inner {padding: 30px 2%;}
  .header_logo {margin-bottom: 20px;}
  .header_nav_line {display: none;}
  .header_nav ul li {font-size: 1.6rem;}

  .header.fixed .header_inner {align-items: center;}
  .header.fixed .header_logo {margin-bottom: 0;}

  #contents { padding-top:60px; }
}
@media (max-width: 800px) {
  /*.loader_logo img { max-width:70%;}*/
  .loader_box .loader_logo{display: inline-block;width: 200px;}    
  
  .header_nav ul li { font-size: 1.5rem;}
  .header.fixed .header_nav ul li + li {margin-left: 0.25em;}
}

/*スマホ*/
@media (max-width: 680px) {
body{background:url(/img/common/bg.jpg) top left / 249px auto repeat}
.contents{background:url(/img/common/bg_cloud_1.png) top right / 53.8666% auto no-repeat, url(/img/common/bg_cloud_5.png) bottom 20% left / 81.3333% auto no-repeat}
.header{background:0 0;position:fixed;top:0;z-index:10;overflow:inherit}
.header_inner,.header_logo{width:100%;padding:0}
.header_inner{align-items:center;height:60px}
.header_logo{margin-bottom:0;box-sizing:border-box}
.header_logo h1{padding:0 5px;z-index:10;position:relative}
.header_logo h1 a{display:inline-block}
.header_logo h1 img{height:44px}
.header>.header_curtain{display:none}
.header_menu{position:absolute;top:-620px;width:100%;text-align:center;padding:100px 40px 60px;box-sizing:border-box;-webkit-transition:.5s ease-in-out;-moz-transition:.5s ease-in-out;transition:.5s ease-in-out;background-color:rgba(255,255,255,.85);z-index:9;overflow:hidden}
.header_nav{top:0}
.header_nav ul{display:block}
.header_nav ul li{font-size:2rem;line-height:2.4}
.header_nav ul li+li{margin-left:0}
.header .header_sns{margin-top:36px;transition:1s}
.header_sns ul{justify-content:center}
.header_sns ul li a{width:28px;height:30px}
.header_sns ul li+li{margin-left:1.6em}
.header_nav_toggle{display:block}
.open .header_nav_toggle span:first-child{top:50%;transform:translateY(-50%) rotate(315deg)}
.open .header_nav_toggle span:nth-child(2){width:0;left:50%}
.open .header_nav_toggle span:nth-child(3){top:50%;transform:translateY(-50%) rotate(-315deg)}
.open .header_menu{transform:translateY(620px)}
.header.fixed .header_inner{padding:5px 0}
.header.fixed .header_sns{display:block}
.footer_inner{display:block}
.footer_logo{width:100px;margin:0 auto 20px}
.common_waku:after{width:calc(100% - 8px);height:calc(100% - 8px);border:4px solid;border-image:url(/img/common/waku_w.svg);border-image-slice:8;}
}