@charset "utf-8";

/* init **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
*{ margin:0; padding:0; box-sizing:border-box; }
select option{ padding:0 5px; }
body{ color:#333; background:#fff url(../images/top_bg.png) center top no-repeat; font:16px helvetica, arial, 'hiragino kaku gothic pro', meiryo, 'ms pgothic', sans-serif; line-height:1.8; text-align:center; min-width:1020px; _display: inline;_zoom:1; }
h1 , h2 , h3 , h4 , h5 , h6 , address{ font-style:normal; font-weight:normal; font-size:100%; }
ul{ list-style-type:none; }
img{ border:0; vertical-align:bottom; }

table{ border-spacing:0; border:0; }
table th{ text-align:left; vertical-align:middle; font-weight:normal; }
table td{ word-break:break-all; }

.floatR{ float:right; }
.floatL{ float:left; }

.alignL{ text-align:left; }
.alignR{ text-align:right; }
.alignC{ text-align:center; }

.rel{ position:relative; }
.abs{ position:absolute; }


/* clearfix **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.cf:after{ content:" "; display:block; clear:both; }


/* link **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
a:link , a:visited{ color:#0000ff; text-decoration:underline; }
a:hover{ color:#ff8000; text-decoration:underline; }
/*a:hover , a img:hover , input[type=image]:hover{ opacity:0.9; }*/


/* font decoration **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* size */
.fontSS{ font-size:12px; }
.fontS{ font-size:14px; }
.fontL{ font-size:20px; }
.fontLL{ font-size:24px; }

/* color */
.txt-red{ color:#e90000; font-weight:bold; }
.txt-blue{ color:#004bd5; font-weight:bold; }

/*indent */
.idt , ul.assist li , .system li{ padding-left:1.0em; text-indent:-1.0em; }
.idt-half{ padding-left:0.5em; text-indent:-0.5em; }

/*other */
.str{ font-weight:bold; }
.str-reset{ font-weight:normal; }

.underline{ text-decoration:underline; }
.underline-double{ border-bottom:double medium; }

.waveline{ background:url(../images/wave_line.png) repeat-x left bottom; padding-bottom:7px; }
.waveline-red{ background:url(../images/wave_line_red.png) repeat-x left bottom; padding-bottom:7px; }
.waveline-blue{ background:url(../images/wave_line_blue.png) repeat-x left bottom; padding-bottom:7px; }

.marker{background-color:#fff600; }

.dot-txt{ letter-spacing:0.9px; padding-top:10px; background-position:top left -2px; background-repeat:repeat-x; }
.dot-txt.dotM{ background-size:17px 5px; }
.dot-txt.dotL{ background-size:21px 5px; }
.dot-txt.dotLL{ background-size:25px 5px; }
.dot-txt.black{ background-image:radial-gradient(3px 3px at center center,#333,#333 80%,transparent); }
.dot-txt.red{ background-image:radial-gradient(3px 3px at center center,#e90031,#e90031 80%,transparent); }
.dot-txt.blue{ background-image:radial-gradient(3px 3px at center center,#004bd5,#004bd5 80%,transparent); }


/* space **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* padding */
.spt0{ padding-top:0px !important; }
.spt5{ padding-top:5px !important; }
.spt10{ padding-top:10px !important; }
.spt15{ padding-top:15px !important; }
.spt20{ padding-top:20px !important; }
.spt25{ padding-top:25px !important; }
.spt30{ padding-top:30px !important; }
.spt35{ padding-top:35px !important; }

.spb0{ padding-bottom:0px !important; }
.spb5{ padding-bottom:5px !important; }
.spb10{ padding-bottom:10px !important; }
.spb15{ padding-bottom:15px !important; }
.spb20{ padding-bottom:20px !important; }
.spb25{ padding-bottom:25px !important; }
.spb30{ padding-bottom:30px !important; }
.spb35{ padding-bottom:35px !important; }

/* margin */
.smt0{ margin-top:0px !important; }
.smt5{ margin-top:5px !important; }
.smt10{ margin-top:10px !important; }
.smt15{ margin-top:15px !important; }
.smt20{ margin-top:20px !important; }
.smt25{ margin-top:25px !important; }
.smt30{ margin-top:30px !important; }
.smt35{ margin-top:35px !important; }
.smt40{ margin-top:40px !important; }
.smt45{ margin-top:45px !important; }
.smt50{ margin-top:50px !important; }

.smb0{ margin-bottom:0px !important; }
.smb5{ margin-bottom:5px !important; }
.smb10{ margin-bottom:10px !important; }
.smb15{ margin-bottom:15px !important; }
.smb20{ margin-bottom:20px !important; }
.smb25{ margin-bottom:25px !important; }
.smb30{ margin-bottom:30px !important; }
.smb35{ margin-bottom:35px !important; }
.smb40{ margin-bottom:40px !important; }
.smb45{ margin-bottom:45px !important; }
.smb50{ margin-bottom:50px !important; }

.sml0{ margin-left:0px !important; }
.sml20{ margin-left:20px !important; }
.sml30{ margin-left:30px !important; }
.sml50{ margin-left:50px !important; }

.smr0{ margin-right:0px !important; }
.smr20{ margin-right:20px !important; }
.smr30{ margin-right:30px !important; }
.smr50{ margin-right:50px !important; }

/* paragraph */
p{ margin:0 50px 30px; }
p.lh-reset{ line-height:1.0; }

/* original frame */
.box{ margin:0 25px; }


/* favorite decoration **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.shadow{ box-shadow:0px 0px 8px rgba(0,0,0,0.4); }

table{ width:calc(100% - 50px); width:-webkit-calc(100% - 50px); border-collapse:separate; border-spacing:1px; background-color:#cdcdcd; line-height:2; font-size:14px; }
/*↑width:calc(100% - boxクラスの左右のmargin); */
table th , table td{ border:1px solid #fff; padding:5px 10px; }
table th{ font-weight:bold; background-color:#cdcdcd; width:22%; vertical-align:middle; }
table td{ background-color:#fff; }
table ol{ margin-left:20px; }

ul.assist{ font-size:12px; padding:15px 25px 12px; line-height:1.6; border:solid 1px #cdcdcd; }

.system{ font-size:14px; }

dl.rule{ padding:20px; border-radius:3px; border:solid 1px #cdcdcd; font-size:12px; line-height:1.6; text-align:left; }
dl.rule dt{ font-weight:bold; font-size:14px; text-align:center; }


/* responsive  **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.pc-item{ display:block; }
.sp-item{ display:none; }

[class^="pic"]{ float:right; margin:0 50px 20px 20px; }
.inner [class^="pic"]{ float:right; margin:0 0 20px 20px; }

.inner{ padding:20px; background-color:#fff; }
.inner p{ margin:0 0 30px; }
.inner p:last-child{ margin:0; }


/* wrap **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.wrap{ width:1000px; margin:0 auto; text-align:left; position:relative; padding-top: 50px; }


/* header **********
///////////////////////////////////////////////////////////////////////////////////////////////*/



/* timer ********** タイマーが必要な場合のみ記述
///////////////////////////////////////////////////////////////////////////////////////////////*/
div.timer{ position:relative; width:325px; height:104px; margin: 0 auto;}
.timer .timeDay{ position:absolute; top:55px; left:-50px; }
.timer .timeHr{ position:absolute; top:55px; left:65px; }
.timer .timeMmin{ position:absolute; top:55px; left:220px; }
.timer .timeSec{ position:absolute; top:80px; left:320px; display:none; }
.timer .timeMsec{ position:absolute; top:80px; left:310px; display:none; }
.timer span img:nth-of-type(2){ margin-left:-6px; }


/* form **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.mailform{
    padding:30px 20px; text-align:center; border:solid 3px #06102f; box-shadow:0 0 1px #fff,0 1px 8px rgba(0,0,0,0.2);
    background:-webkit-linear-gradient(#cfe0f0,#f5faff,#cfe0f0);
    background:-o-linear-gradient(#cfe0f0,#f5faff,#cfe0f0);
    background:linear-gradient(#cfe0f0,#f5faff,#cfe0f0);
 }
.mailform ul{ margin:0 50px 20px; text-align:left; }
.mailform ul li{ margin-bottom:10px; }
.mailform ul li span,.mailform ul li input{ float:left; }
.mailform ul li span{ width:160px; padding-top:7px; }
.mailform ul li input{ width:calc(100% - 160px); width:-webkit-calc(100% - 160px); height:40px; padding:4px; border:solid 1px #aaa; box-shadow:0 0 8px #e2e2e2 inset; font-size:18px; }
.mailform .txt img{ max-width:590px; width:calc(100% - 10px); width:-webkit-calc(100% - 10px); height:auto; margin:10px 5px 0; }

.entry img{ box-shadow:0 1px 8px rgba(0,0,0,0.2); }


/* movie **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.movie-large,.movie-short li{ padding:8px; background-color:#fff; border:solid 2px #a6b2bb; box-shadow:0 0 1px 1px #fff,0 2px 5px rgba(0,0,0,0.2); }

.movie-large{ width:740px; height:auto; margin:0 auto; }
.movie-large .frame{ position:relative; top:0; left:0; width:100%; padding-top:56.25%; }
.movie-large iframe{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:100; }
/*↑ウィンドウサイズに合わせて縦横比固定で縮小させる　padding-top:56.25%;(高さ÷横幅×100) → 16:9のサイズ(9÷16×100=56.25)*/

.movie-short{ width:900px; margin:0 auto; }
.movie-short li{ width:290px; float:left; margin-right:15px; }
.movie-short li:last-child{ margin-right:0; }
.movie-short li .frame{ position:relative; top:0; left:0; width:100%; padding-top:56.25%; }
.movie-short li iframe{ position:absolute; top:0; left:0; width:100%; height:100%; }
.movie-short li span{ display:block; padding:10px 5px; background-color:#7383b8; text-align:center; }


/* intro **********
///////////////////////////////////////////////////////////////////////////////////////////////*/



/* contents **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.bg-w{ background: url("../images/section_line.png")top no-repeat,url("../images/w_bg.png")repeat;}
.bg-y{ background: url("../images/section_line.png")top no-repeat,url("../images/y_bg.png")repeat;}

.message{ font-weight: bold; background: url("../images/message_bg.png")right top repeat; padding: 30px 0; margin-bottom: 30px; box-shadow: 0 0 3px #ffc56f; }

.intro-bg{ background: url("../images/secadd1_pic.png")right top no-repeat;}
.sec1-bg{ background: url("../images/sec1_pic.png")right top 120px no-repeat;}
.sec4-bg{ background: url("../images/sec4_pic.png")right top 300px no-repeat;}

.caution{ background: rgba(255,255,255,0.5); box-shadow: 0px 0px 3px #ffca75; padding: 20px; width: 650px; margin: 0 auto; }

.audio-bg{ width: 1000px; background: rgba(255,255,255,0.7); box-shadow: 0px 0px 6px rgba(130,130,130,0.5); border-radius: 10px; margin: 0 auto; padding: 50px; }
.audio-bg audio{ width: 80%; }

.profile-bg{background:#f4f4f4 url("../images/pro_img.png")top 20px right 50px no-repeat; border: 1px solid #d7bc05; border-radius: 10px; padding: 50px; text-align: left;}
.profile-bg img{margin: 0px auto;}
.profile-bg p{text-align: left;line-height: 2.2rem;}

/* footer **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer{ color:#fff; background-color:#333; padding:10px 10px 20px; text-align:center; }
.footer a{ color:#fff; font-size:12px; }



/* ★★★ タブレット ★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media only screen and (max-width: 768px){
/* init **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
body{ min-width:100%; background: url("../images/top_bg_sp.png")top center / contain no-repeat; }


/* font decoration **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* size */
.fontL{ font-size:20px; }
.fontLL{ font-size:24px; }

.dot-txt.dotL{ background-size:19px 5px; }
.dot-txt.dotLL{ background-size:21px 5px; }


/* space **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* paragraph */
p{ margin:0 10px 20px; }

/* original frame */
.box{ margin:0;}


/* favorite decoration **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.card img{ max-width:366px; width:100%; height:auto; }

table{ width:100%; }
table th , table td{ display:block; }
table th{ width:100%; }


/* responsive **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.pc-item{ display:none; }
.sp-item{ display:block; }

[class^="pic"],.inner [class^="pic"]{ float:none; margin:0 auto 20px; }

.inner{ padding:20px; text-align:center; }
.inner p{ text-align:left; }

.w100 img{ width:100%; height:auto; }
.w95 img{ width:95%; height:auto; }
.w90 img{ width:90%; height:auto; }
.w80 img{ width:80%; height:auto; }
.w70 img{ width:70%; height:auto; }
/*p img{ max-width:520px; width:100%; height:auto; }*/

.br-reset{ display:none; }


/* wrap **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.wrap{ width:100%; padding:0 10px; position:relative; padding-top: 30px; }


/* header **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
/* timer ********** タイマーが必要な場合のみ記述
///////////////////////////////////////////////////////////////////////////////////////////////*/
.timer .sp-item img{ width: 400px; text-align: center; margin: 0 auto; }
div.timer{ position:relative; width:100%; height:0; margin: 0 auto; margin-top: 0; margin-bottom: 0;}
.timer-num{ margin: 0 auto; }
.timer span img{ width:24px; height:36px; }.timer span img:nth-of-type(2){ margin-left:-6px; }
    
.timer{ width:100%; text-align:center; position:static;}
    
.timer-num{ width:360px; height:30px; margin:0 auto 10px; position:relative; top:0; left:0; }
.timer .timeDay{ position:absolute; top:-40px; left:10px; }
.timer .timeHr{ position:absolute; top:-40px; left:115px; }
.timer .timeMmin{ position:absolute; top:-40px; left:260px; }
.timer .timeSec{ display:none }
.timer .timeMsec{ display:none }
    
    .btn{ margin-top: 120px; }


/* movie **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.movie-large{ width:100%; }

.movie-short{ width:100%; }
.movie-short li{ width:378px; float:none; margin:0 auto 15px; }
.movie-short li:last-child{ margin:0 auto; }


/* intro **********
///////////////////////////////////////////////////////////////////////////////////////////////*/



/* contents **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.message{ padding: 10px; }
.intro-bg{ background: url("../images/secadd1_pic_sp.png")right top no-repeat;}
.sec1-bg{ background: url("../images/sec1_pic_sp.png")right top 120px no-repeat;}
.sec4-bg{ background: url("../images/sec4_pic_sp.png")right top 300px no-repeat;}
    
.caution{ width: 100%;}
    
.audio-bg{ width: 100%; padding: 10px;}
.profile-bg{background:#f4f4f4; border: 1px solid #d7bc05; border-radius: 10px; padding: 10px; text-align: left;}


/* footer **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.footer .copy img{ max-width:280px; width:100%; height:auto; }

}



/* ★★★ スマホ ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
@media only screen and (max-width: 414px){ /* iPhone6Plus */
/* init **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
body{ min-width:300px; }


/* responsive **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.br-sp-reset{ display:none; }


/* header **********
///////////////////////////////////////////////////////////////////////////////////////////////*/

/* timer ********** タイマーが必要な場合のみ記述
///////////////////////////////////////////////////////////////////////////////////////////////*/
.timer .sp-item img{ width: 220px; text-align: center; margin: 0 auto; }
div.timer{ position:relative; width:100%; height:0; margin: 0 auto; margin-top: 0; margin-bottom: 0;}
.timer-num{ margin: 0 auto; }
.timer span img{ width:16px; height:24px; }.timer span img:nth-of-type(2){ margin-left:-6px; }
    
.timer{ width:100%; text-align:center; position:static;}
    
.timer-num{ width:360px; height:30px; margin:0 auto 10px; position:relative; top:0; left:0; }
.timer .timeDay{ position:absolute; top:-30px; left:80px; }
.timer .timeHr{ position:absolute; top:-30px; left:140px; }
.timer .timeMmin{ position:absolute; top:-30px; left:222px; }
.timer .timeSec{ display:none }
.timer .timeMsec{ display:none }
    
    .btn{ margin-top: 80px; }



/* form **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.mailform{ padding:10px; }
.mailform ul{ margin:-10px 5px 20px; }
.mailform ul img{ height:14px; }
.mailform ul li{ margin-bottom:0; }
.mailform ul li span,.mailform ul li input{ float:none; display:block; }
.mailform ul li span{ width:100%; padding-top:0; margin-bottom:5px; }
.mailform ul li input{ width:100%; }


/* movie **********
///////////////////////////////////////////////////////////////////////////////////////////////*/
.movie-short li{ width:100%; }


/* contents **********
///////////////////////////////////////////////////////////////////////////////////////////////*/

}


/* Comment form */
#respond {
    margin-top: 0px;
    /* border: 1px solid #ddca6b; */
    padding: 35px;
    /*background-color: #f0f0f0;*/
    outline-offset: -15px;
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0f0f0', endColorstr='#e6e6e6',GradientType=0 );
}

@media only screen and (max-width: 750px) {
#respond {
    padding: 25px;
}
}

#respond h3#reply-title #cancel-comment-reply-link { margin-left: 10px; margin-left: 0.714285714rem; font-weight: normal; font-size: 12px; font-size: 0.857142857rem; }
#respond form { margin: 0px 0;}
#respond form p { margin: 0px 0; }
#respond form p.logged-in-as { margin-bottom: -25px;font-size: 12px; }
#respond form label { display: block; line-height: 1.714285714; }
#respond form input[type="text"], #respond form textarea { -moz-box-sizing: border-box; box-sizing: border-box; font-size: 12px; font-size: 0.857142857rem; line-height: 1.714285714; padding: 10px; padding: 0.714285714rem; width: 100%; }
#respond form p.form-allowed-tags { margin: 0; font-size: 12px; font-size: 0.857142857rem; line-height: 2; color: #5e5e5e; }
.required { color: red; }


@media only screen and (max-width: 750px) {
#respond form input[type="text"], #respond form textarea { line-height: 0.714285714; }}
/* =Front page template
/*Don't forget to add Font Awesome CSS : "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.css"*/
input[type="text"] {
  width: 100%!important;
  border: 1px solid #f29292;
  border-radius: 4px;
  margin: 8px 0;
  outline: none;
padding: 18px 8px 16px 92px!important;
  box-sizing: border-box!important;
  transition: 0.3s;
	font-size: 22px!important;
}
@media only screen and (max-width: 750px) {
input[type="text"] {font-size: 17px!important;}
}


@media only screen and (max-width: 750px) {
input[type="text"] {padding: 12px 8px 12px 45px!important;}
}

@media only screen and (max-width: 750px) {
.yycountdown-box {font-size: 90%;}
}


input[type="text"]:focus {
  border-color: #f29292;
  box-shadow: 0 0 8px 0 #f29292;
}

.inputWithIcon input[type="text"] {
  padding-left: 40px;
}

.inputWithIcon {
  position: relative;
	margin-top: 20px;
}

.inputWithIcon i {
  position: absolute;
  left: 0;
  top: 8px;
  padding: 20px 10px;
  color: #aaa;
  transition: 0.3s;
}

.inputWithIcon input[type="text"]:focus + i {
  color: #312655;
}

.inputWithIcon.inputIconBg i {
  background: linear-gradient(to top, #ca6c6b, #f79797);
  color: #fff;
  padding: 29px 30px;
  border-radius: 4px 0 0 4px;
}

@media only screen and (max-width: 750px) {
.inputWithIcon.inputIconBg i {padding: 18px 10px;}
}


.inputWithIcon.inputIconBg input[type="text"]:focus + i {
  color: #fff;
  background-color: #423c7;
}

#submit {
    background: #2b3070;
    border: none;
    cursor: pointer;
    color: #fff;
    font-size: 14px;
    width: 100%;
    height: 50px;
    margin: 0px auto 0;
    display: block;
    -webkit-transition: background-color 200ms ease-in-out;
    transition: background-color 200ms ease-in-out;
}
#submit:hover { background:#ddca6b; }

.fa-fw {
    text-align: center!important;
    width: 3.25em!important;
}



@media only screen and (max-width: 750px) {
.fa-lg {
    font-size: 0.86667em!important;
    line-height: 0.75em!important;
    vertical-align: -.0667em!important;
}
}


.btn,
a.btn,
button.btn {
    width: 100%;
  font-size: 2.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 2rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

@media only screen and (max-width: 750px) {
.btn,
a.btn,
    button.btn {
    width: 100%;
  font-size: 1.2rem;
        margin-top: 0px;
}
}


.btn--orange,
a.btn--orange {
  color: #fff;
    background: linear-gradient(to top, #ce706f, #f59595);
}
.btn--orange:hover,
a.btn--orange:hover {
  color: #fff;
  background: linear-gradient(to top, #9d9447, #c1b55f);
}



button {
    width: 100%;
    margin: auto;
    background: none !important;
    border-color: #fff;
    padding: 0!important;
    border-style: none;
    
    
}

.terms{background:#f5f5f5;padding:1rem;max-width: 980px;margin:2rem auto;text-align: center;font-weight: bold;border-radius: 10px;}
.terms p{padding:0;text-align: left;font-size:1rem;line-height: 1.8rem;font-weight: normal;font-size: 90%}