/* ------------------------------ color
------------------------------ */
/* ------------------------------ font
------------------------------ */
/* ------------------------------ studio special
------------------------------ */
body.studio-special .contents-main .page-title span { display: inline-block; }
body.studio-special .contents-main .page-banner img { max-width: 660px; }
body.studio-special .contents-main .lead { font-size: 108%; }
body.studio-special .contents-main .content-title { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; margin-right: 30px; margin-bottom: 0; margin-left: 30px; }
body.studio-special .contents-main .point img, body.studio-special .contents-main .program img { -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; }
body.studio-special .contents-main .point .toggle, body.studio-special .contents-main .point .title, body.studio-special .contents-main .program .toggle, body.studio-special .contents-main .program .title { font-size: 115%; font-weight: 700; line-height: 1.5; }
body.studio-special .contents-main .point .toggle, body.studio-special .contents-main .program .toggle { color: #212121; color: #212121; display: none; -webkit-transition: 0.3s opacity ease-out; -moz-transition: 0.3s opacity ease-out; -ms-transition: 0.3s opacity ease-out; transition: 0.3s opacity ease-out; }
body.studio-special .contents-main .point .toggle:before, body.studio-special .contents-main .program .toggle:before { color: #665f5c; content: '\f0fe'; font-family: 'Font Awesome 5 Free'; font-size: 125%; line-height: 20px; margin-top: -10px; position: absolute; right: 20px; top: 50%; }
body.studio-special .contents-main .point .active .toggle:before, body.studio-special .contents-main .program .active .toggle:before { content: '\f146'; }
body.studio-special .contents-main .point .point-body { border-top: 1px solid #e0e0e0; padding-top: 20px; padding-bottom: 40px; }
body.studio-special .contents-main .point .point-body:first-child { border-top: none; padding-top: 0; }
body.studio-special .contents-main .point .point-body:last-child { padding-bottom: 0; }
body.studio-special .contents-main .point .point-body .title, body.studio-special .contents-main .point .point-body .toggle { font-size: 129%; }
body.studio-special .contents-main .point .point-body .title span, body.studio-special .contents-main .point .point-body .toggle span { background: #ff9800; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; color: #fff; display: inline-block; font-size: 80%; margin-right: 5px; padding: 3px 0; text-align: center; width: 70px; }
body.studio-special .contents-main .point .point-body .title { margin-bottom: 15px; }
body.studio-special .contents-main .point .point-body .toggle { padding: 20px 45px 20px 20px; }
body.studio-special .contents-main .point .point-body .image { float: left; padding-right: 10px; width: 50%; }
body.studio-special .contents-main .point .point-body .text { float: right; padding-left: 10px; width: 50%; }
body.studio-special .contents-main .point .teacher { border: 1px solid #e0e0e0; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; font-size: 86%; padding: 20px 20px 20px 140px; min-height: 140px; }
body.studio-special .contents-main .point .teacher img { -webkit-border-radius: 50%; -moz-border-radius: 50%; -ms-border-radius: 50%; border-radius: 50%; position: absolute; top: 20px; left: 20px; width: 100px; }
body.studio-special .contents-main .point .teacher .name { font-weight: 700; }
body.studio-special .contents-main .point .notice { margin-top: 10px; }
body.studio-special .contents-main .program ul { margin-top: 40px; }
body.studio-special .contents-main .program ul:first-child { margin-top: 0; }
body.studio-special .contents-main .program .toggle { padding: 45px 45px 45px 120px; }
body.studio-special .contents-main .program .toggle img { margin-top: -40px; position: absolute; top: 50%; left: 20px; width: 80px; }
body.studio-special .contents-main .program .title { margin-top: 10px; }
body.studio-special .contents-main .program .detail { font-size: 93%; margin-top: 5px; }
body.studio-special .contents-main .program .active .toggle { padding-top: 10px; padding-bottom: 10px; padding-left: 20px; }
body.studio-special .contents-main .program .active .toggle img { display: none; }
body.studio-special .contents-main .content-studio .studio { border-bottom: 1px solid #e0e0e0; margin-bottom: 20px; padding-left: 0; padding-bottom: 40px; min-height: 250px; }
body.studio-special .contents-main .content-studio .studio:last-child { border-bottom: none; margin-bottom: 0; padding-bottom: 0; min-height: 210px; }
body.studio-special .contents-main .content-studio .image { float: left; width: 160px; }
body.studio-special .contents-main .content-studio .image img { position: relative; top: auto; left: auto; width: 100%; }
body.studio-special .contents-main .content-studio .image .btn { margin-top: 10px; }
body.studio-special .contents-main .content-studio p { margin-left: 180px; }
body.studio-special .contents-main .content-studio .lesson, body.studio-special .contents-main .content-studio .detail { margin-top: 10px; }
body.studio-special .contents-main .content-studio .lesson { background: #eee; -webkit-border-radius: 3px; -moz-border-radius: 3px; -ms-border-radius: 3px; border-radius: 3px; font-size: 86%; padding: 5px 8px; }
body.studio-special .contents-main .content-studio .btns { display: none; padding-bottom: 0; text-align: center; }

@media screen and (max-width: 767px) { body.studio-special .contents-main .content-title { -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; border-radius: 0; margin-right: 0; margin-left: 0; }
  body.studio-special .contents-main .point .toggle, body.studio-special .contents-main .program .toggle { display: block; }
  body.studio-special .contents-main .point .full, body.studio-special .contents-main .program .full { display: none; }
  body.studio-special .contents-main .point .title, body.studio-special .contents-main .program .title { display: none; }
  body.studio-special .contents-main .point .active .full, body.studio-special .contents-main .program .active .full { display: block; }
  body.studio-special .contents-main .point .point-body { padding: 0; }
  body.studio-special .contents-main .point .point-body .toggle { font-size: 115%; }
  body.studio-special .contents-main .point .point-body .full { padding: 0 20px 20px; }
  body.studio-special .contents-main .point .teacher { border-right: none; border-left: none; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; border-radius: 0; }
  body.studio-special .contents-main .point .notice { padding-right: 20px; padding-bottom: 40px; padding-left: 20px; }
  body.studio-special .contents-main .program ul { margin-top: 0; }
  body.studio-special .contents-main .program li { border-bottom: 1px solid #e0e0e0; }
  body.studio-special .contents-main .program .full { padding: 0 20px 20px; }
  body.studio-special .contents-main .program .detail { margin-top: 10px; }
  body.studio-special .contents-main .content-studio .studio { margin-bottom: 0; padding: 20px; padding-bottom: 20px !important; min-height: 210px; }
  body.studio-special .contents-main .content-studio .studio:last-child { min-height: 190px; }
  body.studio-special .contents-main .content-studio .image { width: 120px; }
  body.studio-special .contents-main .content-studio p { margin-left: 140px; } }
@media screen and (max-width: 640px) { body.studio-special .contents-main .point .point-body .toggle { padding-left: 80px; }
  body.studio-special .contents-main .point .point-body .toggle span { font-size: 67%; line-height: 16px; margin-top: -25px; padding: 9px 0; position: absolute; top: 50%; left: 20px; text-align: center; width: 50px; }
  body.studio-special .contents-main .point .point-body .toggle span strong { display: inline-block; font-size: 125%; }
  body.studio-special .contents-main .point .point-body .image, body.studio-special .contents-main .point .point-body .text { float: none; padding-right: 0; padding-left: 0; width: auto; }
  body.studio-special .contents-main .point .point-body .text { padding-top: 10px; }
  body.studio-special .contents-main .content-studio .studio { padding-bottom: 20px; min-height: inherit; }
  body.studio-special .contents-main .content-studio .studio:last-child { min-height: inherit; }
  body.studio-special .contents-main .content-studio .image { padding-bottom: 10px; width: 80px; }
  body.studio-special .contents-main .content-studio .image .btn { display: none; }
  body.studio-special .contents-main .content-studio p { margin-left: 100px; }
  body.studio-special .contents-main .content-studio .name { padding-bottom: 10px; }
  body.studio-special .contents-main .content-studio .lesson, body.studio-special .contents-main .content-studio .detail { margin-left: 0 !important; }
  body.studio-special .contents-main .content-studio .lesson { clear: both; margin-top: 0; }
  body.studio-special .contents-main .content-studio .btns { display: block; } }
@media screen and (max-width: 480px) { body.studio-special .contents-main .point .toggle:before, body.studio-special .contents-main .program .toggle:before { right: 10px; }
  body.studio-special .contents-main .point .point-body .toggle { padding: 10px 35px 10px 70px; }
  body.studio-special .contents-main .point .point-body .toggle span { left: 10px; }
  body.studio-special .contents-main .point .point-body .full { padding-right: 10px; padding-left: 10px; }
  body.studio-special .contents-main .point .teacher { padding: 10px 10px 10px 90px; min-height: 90px; }
  body.studio-special .contents-main .point .teacher img { top: 10px; left: 10px; width: 70px; }
  body.studio-special .contents-main .point .notice { padding-right: 10px; padding-left: 10px; }
  body.studio-special .contents-main .program .toggle { padding: 32px 35px 32px 90px; }
  body.studio-special .contents-main .program .toggle:before { right: 10px; }
  body.studio-special .contents-main .program .toggle img { margin-top: -35px; left: 10px; width: 70px; }
  body.studio-special .contents-main .program .full { padding-left: 10px; padding-right: 10px; }
  body.studio-special .contents-main .program .active .toggle { padding-left: 10px; }
  body.studio-special .contents-main .content-studio .studio { padding-top: 10px; padding-right: 10px; padding-left: 10px; }
  body.studio-special .contents-main .content-studio .image { width: 70px; }
  body.studio-special .contents-main .content-studio p { margin-left: 80px; } }
