@charset "UTF-8";

* { text-decoration:none; box-sizing:border-box; }
html { background:#e2f4f8; }
body { background:transparent; font-size:0.95em; line-height:1.8em; font-weight:lighter; letter-spacing:0.05em; font-family:sans-serif; }
img { max-width:100%; }

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

.flexbox01 { display:flex; flex-direction:row; flex-wrap:wrap; }
.flexbox02 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:flex-end; }
.flexbox03 { display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:space-between; }
.flexbox04 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
.youtube { position:relative; width:100%; padding-top:56.25%; }
.youtube iframe { position:absolute; top:0; right:0; width:100%; height:100%; }
.fadeUp{ animation-name:fadeUpAnime; animation-duration:0.5s; animation-fill-mode:forwards; opacity:0; }
@keyframes fadeUpAnime{from{ opacity:0; transform:translateY(150px); }to{ opacity:1; transform:translateY(0); }}
.fadeUpTrigger{ opacity:0; }

@keyframes move-twink-back { from {background-position:0 0;} to {background-position:-10000px 5000px;} }
@-webkit-keyframes move-twink-back { from {background-position:0 0;} to {background-position:-10000px 5000px;} }
@-moz-keyframes move-twink-back { from {background-position:0 0;} to {background-position:-10000px 5000px;} }
@-ms-keyframes move-twink-back { from {background-position:0 0;} to {background-position:-10000px 5000px;} }
@keyframes move-clouds-back { from {background-position:0 0;} to {background-position:10000px 0;} }
@-webkit-keyframes move-clouds-back { from {background-position:0 0;} to {background-position:10000px 0;} }
@-moz-keyframes move-clouds-back { from {background-position:0 0;} to {background-position:10000px 0;} }
@-ms-keyframes move-clouds-back { from {background-position:0;} to {background-position:10000px 0;} }
.stars, .twinkling, .clouds {position:absolute;top:0;left:0;right:0;bottom:0;width:100%;height:100%;display:block;}
.stars { background:#020d43 url(../images/stars.png) repeat top center; z-index:-10; }
.twinkling{ background:transparent url(../images/twinkling.png) repeat top center; z-index:-9;
  -moz-animation:move-twink-back 200s linear infinite;
  -ms-animation:move-twink-back 200s linear infinite;
  -o-animation:move-twink-back 200s linear infinite;
  -webkit-animation:move-twink-back 200s linear infinite;
  animation:move-twink-back 200s linear infinite;
}
.clouds{ background:transparent url(../images/clouds.png) repeat top center; z-index:-8;
  -moz-animation:move-clouds-back 200s linear infinite;
  -ms-animation:move-clouds-back 200s linear infinite;
  -o-animation:move-clouds-back 200s linear infinite;
  -webkit-animation:move-clouds-back 200s linear infinite;
  animation:move-clouds-back 200s linear infinite;
}

.hamburger { display:none; }
nav.globalMenuSp { display:none; }

#wrapper { position:relative; font-family:sans-serif; }
#wrapper #online { position:fixed; right:3%; bottom:3%; z-index:200; animation:SlideIn 0.3s; }
#wrapper #online img { width:200px; }
@keyframes SlideIn { 0% {transform:translateY(200px);} 100% {transform:translateY(0);} }
#header { background:#fff; height:80px; box-sizing:border-box; width:100%; position:fixed; z-index:1000; }
#header #header_inner { margin:0 auto; padding:0; max-width:1080px; }
#header #header_inner h1 { margin:20px 0 0 0; width:179px; }
#header #header_inner ul { margin:0; padding:5px 0 0 0; }
#header #header_inner ul li { position:relative; margin:0 0 0 40px; font-size:0.9rem; letter-spacing:0; font-weight:bolder; }
#header #header_inner ul li a { padding:18px 0; display:block; }
#header #header_inner ul li a.arrow_h { position:relative; display:inline-block; padding-right:20px; color:#333; text-decoration:none; }
#header #header_inner ul li a.arrow_h:before { position:absolute; margin-top:-6px; top:50%; right:0; content:''; width:8px; height:8px; border:0; border-bottom:solid 2px #333; border-right:solid 2px #333; transform:rotate(45deg); }
#header #header_inner ul li a:hover { color:#ee780f; }

#footer { padding:60px 0 0 0; font-size:0.75rem; letter-spacing:0; text-align:center; color:#fff; }


#content { }
#content .inner { margin:0 auto; padding:70px 0; max-width:1080px; }
#content .inner_star { margin:0 auto; padding:95px 0 60px; max-width:1080px; }
#block01 { position:relative; padding:80px 0 0 0; background:transparent url(/images/header.jpg) left top no-repeat; background-size:cover; z-index:1; }
#block01 #block01_inner { position:relative; margin:0 auto; max-width:1080px; height:730px; }
#block01 #block01_inner h1#kv_ttl { margin:0 auto; padding:95px 0 0 0; width:565px; }
#block01 #block01_inner div#kv_img { margin:20px auto 0; width:1080px; }
#block02_topwrap { background-color:#e2f4f8; width:100%; }
#block02_topwrap #block02_top { position:relative; margin:-100px auto 0; padding:70px 0; background-color:#fff; max-width:768px; box-shadow:0px 0px 6px 0px rgba(0, 0, 0, .1); border-radius:10px; z-index:100; display:block; }
#block02_topwrap #block02_top #block02_logo { margin:0 auto 30px; width:335px; }
#block02_topwrap #block02_top p { color:#000; text-align:center; }
#block02 { position:relative; background-color:#e2f4f8; }
#block02 #block02_ttl { margin:0 auto; padding:70px 0 30px 0; text-align:center; font-size:4rem; font-family:'Hind',sans-serif; font-weight:600; line-height:0.7; width:300px; background:linear-gradient(45deg, rgba(45,106,190,1) 0%, rgba(86,174,217,1) 100%); background:-webkit-linear-gradient(45deg, rgba(45,106,190,1) 0%, rgba(86,174,217,1) 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
#block02 #block02_lead { font-size:2.2rem; color:#44403b; font-weight:bold; text-align:center; }
#block02 ul#block02_lst { margin:0 auto; padding:50px 0 70px; max-width:1080px; }
#block02 ul#block02_lst li { margin:0 0 25px; width:49%; }
#block02 ul#block02_lst li a { position:relative; padding:5px; background:#fff; box-shadow:0px 0px 6px 0px rgba(0, 0, 0, .1); border-radius:10px; display:block; }
#block02 ul#block02_lst li a:hover { opacity:0.9; box-shadow:none; }
#block02 ul#block02_lst li figure { padding:30px 50px; }
#block02 ul#block02_lst li figure.pillow { text-align:center; }
#block02 ul#block02_lst li ul.sizetab { position:absolute; right:50px; bottom:120px; }
#block02 ul#block02_lst li ul.sizetab li { margin:0 0 3px; padding:0; text-align:center; color:#fff; font-size:0.7rem; width:100px; }
#block02 ul#block02_lst li ul.sizetab li.single { background:#56aed9; border-radius:3px; }
#block02 ul#block02_lst li ul.sizetab li.semidouble { background:#c0ad30; border-radius:3px; }
#block02 ul#block02_lst li ul.sizetab li.double { background:#a5883b; border-radius:3px; }
#block02 ul#block02_lst li .itemwrap { padding:20px 0; background:linear-gradient(45deg, rgba(45,106,190,1) 0%, rgba(86,174,217,1) 100%); width:100%; border-radius:10px; display:block; }
#block02 ul#block02_lst li .itemwrap h2 { font-size:1.6rem; font-weight:bold; line-height:0.9; text-align:center; color:#fff; display:block; }
#block02 ul#block02_lst li .itemwrap h2 span { font-size:0.8rem; font-weight:normal; }
#block02 ul#block02_lst li a .arrow { position:relative; }
#block02 ul#block02_lst li a .arrow::before { position:absolute; top:0; bottom:0; margin:auto; content:""; vertical-align:middle;right:25px!important; width:16px; height:16px; border-top:2px solid #fff; border-right:2px solid #fff; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
#block02 ul#block02_lst li a:hover .arrow::before { right:30px!important; }
#block03 { position:relative; }
#block03 #block03_inner { margin:0 auto; padding:45px; background-color:#fff; max-width:768px; box-shadow:0px 0px 6px 0px rgba(0, 0, 0, .1); border-radius:10px; }
#block03 #block03_inner h3#block03_ttl01 { margin:0 0 40px; padding:5px 0; background:#021051; color:#fff; font-size:0.9rem; text-align:center; border-radius:5px; }
#block03 #block03_inner figure#block03_ttl { margin:0 auto; width:563px; }
#block03 #block03_inner p#block03_ttltxt { margin:30px 0 60px 60px; font-size:0.7rem; line-height:1.4; }
#block03 #block03_inner #block03_po01 { margin:0 0 25px; padding:0 50px; }
#block03 #block03_inner #block03_po01 h3#block03_ttl02 { margin:0 0 10px; color:#ee780f; font-size:1.1rem; font-weight:bold; }
#block03 #block03_inner #block03_po01 p#block_txt01 { margin:0 0 25px; font-size:0.9rem; }
#block03 #block03_inner #block03_po01 figure { margin:0 0 40px; }
#block03 #block03_inner #block03_po01 ul#block03_comp {}
#block03 #block03_inner #block03_po01 ul#block03_comp li { text-align:center; }
#block03 #block03_inner #block03_po01 ul#block03_comp li h4 { margin:0; font-size:0.9rem; }
#block03 #block03_inner #block03_po01 ul#block03_comp li img { border:solid 1px #f1f1f1; }
#block03 #block03_inner #block03_po01 p#block03_att { margin:5px 0 0 0; text-align:right; font-size:0.75rem; }
#block03 #block03_inner ul#block03_lst { }
#block03 #block03_inner ul#block03_lst li { margin:0 0 25px; width:49%; text-align:center; }
#block03 #block03_inner ul#block03_lst li figure {}
#block03 #block03_inner ul#block03_lst li p { font-size:0.8rem; }
#block03 #block03_inner dl { margin:0 0 10px; padding:0 0 0 5px; height:100px; background:#f5f5f5; border-radius:50px; align-items:center; }
#block03 #block03_inner dl dt { padding:7px 0 0 0; width:90px; height:90px; color:#fff; font-size:2.6rem; text-align:center; font-family:'Hind',sans-serif; font-weight:500; background:#ee780f; line-height:0.7; border-radius:50%; }
#block03 #block03_inner dl dt span { font-size:1rem; line-height:2; }
#block03 #block03_inner dl dd {}
#block03 #block03_inner dl dd h2 { padding:0 0 0 15px; font-size:1.2rem; font-weight:bold; text-align:left; }
#block03 #block03_inner p.att { margin:0; text-align:right; font-size:0.75rem; }


@media only screen and (max-width: 960px) {
.hamburger { display:block; position:fixed; z-index:201; right:2%; top:10px; width:42px; height:32px; cursor:pointer; text-align:center; }
.hamburger span { display:block; position:absolute; width:30px; height:2px; left:6px; background:#555; -webkit-transition:0.3s ease-in-out; -moz-transition:0.3s ease-in-out; transition:0.3s ease-in-out; }
.hamburger span:nth-child(1) { top:10px; }
.hamburger span:nth-child(2) { top:18px; }
.hamburger span:nth-child(3) { top:26px; }
/* ナビ開いてる時のボタン */
.hamburger.active span:nth-child(1) { top:18px; left:6px; background:#000; -webkit-transform:rotate(-45deg); -moz-transform:rotate(-45deg); transform:rotate(-45deg); }
.hamburger.active span:nth-child(2),
.hamburger.active span:nth-child(3) { top:18px; background:#000; -webkit-transform:rotate(45deg); -moz-transform:rotate(45deg); transform:rotate(45deg); }
nav.globalMenuSp { display:block; position:fixed; z-index:10; top:0; left:0; color:#000; background:rgba(255,255,255,.95); text-align:center; width:100%; height:100%; opacity:0; visibility:hidden; transition:opacity .6s ease, visibility .6s ease; }
nav.globalMenuSp ul { margin:25% auto 0; padding:0 10%; width:100%; }
nav.globalMenuSp ul li { list-style-type:none; padding:0; width:100%; text-align:left; transition:.4s all; border-bottom:solid 1px #ccc; }
nav.globalMenuSp ul li a { display:block; color:#000; padding:6% 0; text-decoration:none; font-weight:bold; }
/* このクラスを、jQueryで付与・削除する */
nav.globalMenuSp.active { opacity:100; visibility:visible; z-index:150; }

.youtube { margin:10px 0 0; }

#wrapper #online { width:30%; right:2%; bottom:2%; }
#header { position:fixed; height:60px; width:100%; z-index:200; }
#header #header_inner { max-width:100%; }
#header #header_inner h1 { margin:13px 0 0 20px; width:140px; }
#header #header_inner ul { display:none; }

#footer { padding:30px 0 0 0; font-size:0.7rem; }


#content .inner { margin:0 5%; padding:40px 0; max-width:100%; }
#content .inner_star { margin:0 5%; padding:60px 0 60px; max-width:100%; }
#block01 #block01_inner { position:relative; margin:0 auto; padding:0; max-width:100%; height:420px; }
#block01 #block01_inner h1#kv_ttl { padding:50px 15% 0 15%; width:100%; }
#block01 #block01_inner div#kv_img { margin:30px auto 0; width:100%; }
}






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

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

.flexbox01 { display:flex; flex-direction:row; flex-wrap:wrap; }
.flexbox02 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
.flexbox03 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
.flexbox04 { display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }

nav.globalMenuSp ul li ul li { margin:0 0 15px; padding:0 25%; }

.youtube { margin:5px 0 0; }

#wrapper #online {  }


#content .inner { margin:0 10%; padding:40px 0; max-width:100%; }
#content .inner_star { margin:0 10%; padding:40px 0 20px; max-width:100%; }
#block02_topwrap #block02_top { position:relative; margin:-100px 15% 0; padding:30px 20px; max-width:100%; }
#block02_topwrap #block02_top #block02_logo { margin:0 10% 30px; width:80%; }
#block02_topwrap #block02_top p { text-align:left; font-size:0.9rem; line-height:1.6; }
#block02_topwrap #block02_top p br { display:none; }
#block02 { position:relative; }
#block02 #block02_ttl { margin:0 auto; padding:60px 0 10px 0; font-size:2.6rem; width:100%; }
#block02 #block02_lead { font-size:1.2rem; text-align:center; line-height:1.2; }
#block02 ul#block02_lst { margin:0 10%; padding:20px 0 30px; max-width:100%; }
#block02 ul#block02_lst li { margin:0 0 15px; width:100%; }
#block02 ul#block02_lst li a { position:relative; padding:5px; background:#fff; box-shadow:0px 0px 6px 0px rgba(0, 0, 0, .1); border-radius:10px; display:block; }
#block02 ul#block02_lst li figure { padding:20px 20px; }
#block02 ul#block02_lst li ul.sizetab { padding:10px 20px; position:static; display:flex; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
#block02 ul#block02_lst li ul.sizetab li { width:31%; }
#block02 ul#block02_lst li .itemwrap { padding:15px; background:linear-gradient(45deg, rgba(45,106,190,1) 0%, rgba(86,174,217,1) 100%); width:100%; border-radius:10px; display:block; }
#block02 ul#block02_lst li .itemwrap h2 { font-size:1.2rem; text-align:left; }
#block02 ul#block02_lst li .itemwrap h2 span { font-size:0.7rem; }
#block02 ul#block02_lst li a .arrow { position:relative; }
#block02 ul#block02_lst li a .arrow::before { position:absolute; top:0; bottom:0; margin:auto; content:""; vertical-align:middle;right:25px!important; width:16px; height:16px; border-top:2px solid #fff; border-right:2px solid #fff; -webkit-transform:rotate(45deg); transform:rotate(45deg); }
#block03 { position:relative; }
#block03 #block03_inner { margin:0 auto; padding:15px 5% 0; max-width:100%; }
#block03 #block03_inner h3#block03_ttl01 { margin:0 0 40px; padding:5px 0; background:#021051; color:#fff; font-size:0.9rem; text-align:center; border-radius:5px; }
#block03 #block03_inner figure#block03_ttl { margin:0; padding:0 5%; width:100%; }
#block03 #block03_inner figure#block03_ttl img { width:100%; }
#block03 #block03_inner p#block03_ttltxt { margin:20px 5% 40px 5%; font-size:0.7rem; line-height:1.4; }
#block03 #block03_inner p#block03_ttltxt br { display:none; }
#block03 #block03_inner #block03_po01 { margin:0 0 25px; padding:0 10%; }
#block03 #block03_inner #block03_po01 h3#block03_ttl02 { margin:0 0 10px; color:#ee780f; font-size:1rem; }
#block03 #block03_inner #block03_po01 p#block_txt01 { margin:0 0 15px; font-size:0.8rem; line-height:1.6; }
#block03 #block03_inner #block03_po01 p#block_txt01 br { display:none; }
#block03 #block03_inner #block03_po01 figure { margin:0 0 30px; }
#block03 #block03_inner #block03_po01 ul#block03_comp li { margin:0 0 10px; text-align:left; }
#block03 #block03_inner #block03_po01 ul#block03_comp li h4 { margin:0; font-size:0.8rem; }
#block03 #block03_inner #block03_po01 p#block03_att { font-size:0.7rem; }
#block03 #block03_inner ul#block03_lst li { margin:0 0 25px; width:100%; text-align:center; }
#block03 #block03_inner ul#block03_lst li figure {}
#block03 #block03_inner ul#block03_lst li p { font-size:0.8rem; }
#block03 #block03_inner dl { margin:0 0 10px; padding:0 0 0 5px; height:80px; }
#block03 #block03_inner dl dt { padding:5px 0 0 0; width:60px; height:60px; font-size:1.8rem; }
#block03 #block03_inner dl dt span { font-size:0.8rem; line-height:1.6; }
#block03 #block03_inner dl dd h2 { padding:0 0 0 10px; font-size:1rem; line-height:1.4; }
#block03 #block03_inner p.att { margin:0; padding:0 0 20px; text-align:left; font-size:0.7rem; }
}
