@charset "utf-8";
@media print, screen and (max-width:768px){
/*=========================================================================
CONTANTES BASIC
=========================================================================*/
.btn_join {width: 90%;}

@media print, screen and (max-width:414px){
.btn_join {width: 90%;}
}

/* -------------------------------------------------------------- */
#mainContents {padding:12% 0;}

/* -------------------------------------------------------------- */
.one_period {margin-bottom: 9%; font-size: 13px;}
.one_period p {margin-bottom: 3%;}

@media print, screen and (max-width:414px){
.one_period {font-size:3vw;  margin-bottom: 12%;}
}

/* -------------------------------------------------------------- */
.period_headline {margin-bottom: 4%;}
.period_headline span {font-size: 3.2vw; width: 84%;} 
.period_headline figure {width: 13%; margin-right: 3%;}

@media print, screen and (max-width:414px){
.period_headline {margin-bottom: 6%;}
.period_headline span {font-size: 3.8vw; width: 80%;}
.period_headline figure {width: 17%; margin-right: 3%;}
}

/* -------------------------------------------------------------- */
.period_headline.ver_sitelogo {padding-bottom: 0; margin-bottom: 3%;}

.period_headline.ver_sitelogo span, 
.period_headline.ver_sitelogo figure {vertical-align: middle;}

.period_headline.ver_sitelogo figure {width: 24%; margin-right: 2%;}
.period_headline.ver_sitelogo span {width:74%; }

/* -------------------------------------------------------------- */
.sub_headline {margin-bottom: 4%;font-size: 3vw; }
.caution{margin-bottom: 8%; }
.caution p{display: inline-block; color: #FF0000; text-decoration: underline; text-decoration-color: #FFF;}

@media print, screen and (max-width:414px){
.sub_headline {font-size: 3.8vw; margin-bottom: 6%;}
}


/*=========================================================================
FIRST VIEW
=========================================================================*/
#firstView {padding: 12% 0 9%;}

@media print, screen and (max-width:414px){
#firstView {padding: 18% 0;}
}


/* -------------------------------------------------------------- */
#Logo {width: 53%; margin-bottom: 6%;}

@media print, screen and (max-width:414px){
#Logo {width: 60%;}
}

/* -------------------------------------------------------------- */
#viewCatch {font-size: 3.8vw; margin-bottom: 6%;}
#viewInfo {font-size: 2.1vw; margin-bottom: 6%;}

@media print, screen and (max-width:414px){
#viewCatch {font-size: 4vw;}
#viewInfo {font-size: 2.8vw;}
#viewInfo br {display: none;}
}


/* -------------------------------------------------------------- */
dl#resubNotes {letter-spacing: -.4em; font-size: 0; margin-top: 6%;}

dl#resubNotes dt,
dl#resubNotes dd {letter-spacing: 0;display: inline-block;vertical-align: top;font-size: 100%;width: 48%;}

/* -------------------------------------------------------------- */
dl#resubNotes dt {margin-right: 4%;}


@media print, screen and (max-width:414px){
dl#resubNotes {margin:9% auto; width: 100%; }
dl#resubNotes dt,
dl#resubNotes dd { margin: 0 auto; display: block;}
dl#resubNotes dt {margin-bottom:12%; width: 74%;}
dl#resubNotes dd {width: 80%;}
}
@media print, screen and (max-width:320px){
dl#resubNotes dt {width: 80%;}
}

/* -------------------------------------------------------------- */
.view_boxtext {font-size: 2.6vw; padding: 4% 1%; margin: 0 auto;}

@media print, screen and (max-width:414px){
.view_boxtext {font-size: 3vw;}
}


/* -------------------------------------------------------------- */
dl#resubNotes dt .view_boxtext {margin-bottom: 18%;}

@media print, screen and (max-width:414px){
dl#resubNotes dt .view_boxtext {font-size: 4vw;}
}

/* -------------------------------------------------------------- */
#Extra.view_boxtext {padding-top:9%; padding-bottom: 9%;} 

/* -------------------------------------------------------------- */
dl#resubNotes dt .view_boxtext:after {top: 115%; width: 5.5%; height: 100%;}

@media print, screen and (max-width:414px){
dl#resubNotes dt .view_boxtext:after {top: 115%;}
}

/* -------------------------------------------------------------- */
img#viewIcon {width: 38%; margin-bottom: 5%;}

@media print, screen and (max-width:414px){
img#viewIcon {width: 36%;}
}

/* -------------------------------------------------------------- */
dl#resubNotes dd, dl#resubNotes dd p {font-size:2vw;}
dl#resubNotes dd p {margin-bottom: 1%;}

@media print, screen and (max-width:414px){
dl#resubNotes dd, dl#resubNotes dd p {font-size:3vw;}
}


/* -------------------------------------------------------------- */
#notesHeadline {font-size: 2.4vw; margin-bottom: 3%; padding-bottom: 2%; }

@media print, screen and (max-width:414px){
#notesHeadline {font-size: 3.4vw; }
}

/* -------------------------------------------------------------- */
#resubPickup {margin-top: 6%;}


/*=========================================================================
PROMOTION
=========================================================================*/
dl#bookContainer {letter-spacing: -.4em; font-size: 0; margin-bottom: 5%;}

@media print, screen and (max-width:414px){
dl#bookContainer {letter-spacing: 1px; font-size: 100%;}
}
dl#bookContainer h2{color: #FFF; display: block; text-align: center; margin-bottom: 5%; font-size: 5.6vw; line-height: 5.6vw;}
dl#bookContainer h2 img{vertical-align: text-bottom; width: 45%; padding-right: 2.5%;}


/* -------------------------------------------------------------- */
dl#bookContainer dt,
dl#bookContainer dd {letter-spacing: 0; font-size: 100%; display: inline-block; vertical-align: top;}


@media print, screen and (max-width:414px){
dl#bookContainer dt,dl#bookContainer dd {display:block; margin: 0 auto;}
}

/* -------------------------------------------------------------- */
dl#bookContainer dt {width: 50%; margin-right: 6%;}

@media print, screen and (max-width:414px){
dl#bookContainer dt {width: 80%; margin:0 auto 9%;}
}

/* -------------------------------------------------------------- */
dl#bookContainer dd {width: 44%; font-size: 2vw;}
dl#bookContainer dd p {margin-bottom: 3%; display: block; padding: 2.5% 0; text-align: center; margin-bottom: 5%; border: 1px solid #FFF;}

@media print, screen and (max-width:414px){
dl#bookContainer dd {font-size: 3vw; width: 100%; margin: 0 auto;}
}


/* -------------------------------------------------------------- */
.book_pickup {margin-bottom: 1.2%; font-size: 2.1vw;}
.book_pickup:first-of-type {padding-top: 9%;}

@media print, screen and (max-width:414px){
.book_pickup { font-size: 3.2vw;}
.book_pickup:first-of-type {padding-top: 4%;}
}

.book-btm p{padding-top: 2em; font-size: 3.2vw;}
.book-profile{margin-top: 4em; font-size: 3.2vw;}
.book-profile strong{ font-size: 3.6vw; margin-bottom: 5%; text-align: center; display: block;}
.book-profile span{ font-size: 3.2vw; margin-bottom: 5%; text-align: center; display: block;}
.book-link{margin-bottom: 5%;}
.book-link ul{display: block;}
.book-link ul li{width: 100%; margin-bottom: 5%;}
.book-link ul li a{display:block; width: 100%; padding: 15px 0; color: #FFF; background-color: #FF0000; border-radius: 50px; font-size: 4.2vw; text-decoration: none; text-align: center;}

/* -------------------------------------------------------------- */
#bookHeadline {font-size: 3.5vw; margin-bottom: 6%;}

@media print, screen and (max-width:414px){
#bookHeadline {font-size: 3.6vw; margin-bottom: 4%; text-align: center;}
}
@media print, screen and (max-width:320px){
#bookHeadline {font-size: 3.6vw;}
}


/*=========================================================================
ABOUT
=========================================================================*/
#aboutTitle {font-size: 3.8vw; margin-bottom: 6%;}
#aboutTitle img.text_logo {width: 24%; display: inline-block;margin-right: 1%;}

@media print, screen and (max-width:414px){
#aboutTitle {font-size: 4vw;}
}


/* -------------------------------------------------------------- */
ul.instructor_list li {width: 47.5%; margin: 0 5% 7.5% 0; font-size: 2vw;}
ul.instructor_list li:nth-of-type(even) {margin-right: 0;}
ul.instructor_list .sp-none{display: none;}
@media print, screen and (max-width:414px){
ul.instructor_list li {font-size: 3vw;}
}

@media print, screen and (max-width:320px){
ul.instructor_list {letter-spacing: 0;}
ul.instructor_list li {display: block; width: 100%; margin: 0 auto 5%;letter-spacing: -.4em;}
ul.instructor_list li:nth-of-type(even) { margin: 0 auto 5%;}
ul.instructor_list li:last-of-type { margin-bottom: 0;}
}


/* -------------------------------------------------------------- */
.instructor_photo {margin-bottom: 6%;}

@media print, screen and (max-width:320px){
.instructor_photo, .instructor_data {display:inline-block; vertical-align: top; letter-spacing: 0;}
.instructor_photo {width: 38%; margin: 0 5% 0 0; }
.instructor_data {width: 57%;}
}

/* -------------------------------------------------------------- */
.instructor_name {font-size:2.8vw; margin-bottom: 6%; letter-spacing: 0;}

@media print, screen and (max-width:414px){
.instructor_name {font-size:3.4vw;}
}
@media print, screen and (max-width:320px){
.instructor_name {font-size:3.6vw;text-align: left;}
}

/*=========================================================================
BOTTOM
=========================================================================*/
#bottomHeadline {width: 30%; margin-bottom: 10%;}

#Bottom dl#resubNotes {margin-bottom: 12%;} 





/*=========================================================================
MODAL
========================================3================================*/
.other_section, .other_section p {font-size: 13px;}
.other_section {margin-bottom: 45px;}
.other_section p br {display: none;}

@media print, screen and (max-width:414px){
.other_section, .other_section p  {font-size:2.8vw;}
.other_section {margin-bottom: 6%;}
.other_section p {margin-bottom: 4%;}
}


/* -------------------------------------------------------------- */
.other_pageTitle {font-size: 18px; margin-bottom: 10px;}
#Specified.other_pageTitle {margin-bottom: 30px;}

@media print, screen and (max-width:414px){
.other_pageTitle {font-size:4vw; margin-bottom: 1%;}
#Specified.other_pageTitle {margin-bottom: 6%;}

}

/* -------------------------------------------------------------- */
#btnClose {margin-top: 12%; font-size: 15px;}

@media print, screen and (max-width:414px){
#btnClose {font-size: 3vw;}
}


/* -------------------------------------------------------------- */
dl#specifiedbody {border-top: 1px solid #ccc;}
dl#specifiedbody dt, dl#specifiedbody dd { width: 100%; height: auto;}

dl#specifiedbody dt {padding-top: 15px; margin-bottom: 5px;}
dl#specifiedbody dd {border-bottom: 1px solid #ccc; padding-bottom: 15px; }
dl#specifiedbody dt p, dl#specifiedbody dd p {font-size:13px;}
dl#specifiedbody dd p br {display: block;}

@media print, screen and (max-width:414px){
dl#specifiedbody dt {margin-bottom: .5%; padding-top: 3%;}
dl#specifiedbody dd {padding-bottom: 3%;}
dl#specifiedbody dt p, dl#specifiedbody dd p {font-size:3.2vw;}
}


}