@charset "utf-8";
#contents {
  font-size:16px;
  font-size:1.6rem;
  padding-top: 0;
  line-height: 1.8;
}

.colPNK{color:#d20059!important;}
.colORA{color:#ff6411!important;}
.colRED{color:#e40000!important;}
strong span {font-weight: bold;}
.content-box {
  padding: 0 5% 40px;
}
.isDeviceTB .content-box {
  padding-right: 0;
  padding-left: 0;
}

sup{
  vertical-align: super;
  font-size:10px;
  font-size:1rem;
}
/*------------------------------------------------*/

.main {
  padding-top: 20px;
  margin-bottom:  40px !important;
}
.main .txt {
  background: #f2f2f2;
  color: #000;
  line-height: 1.8;
  padding: 40px 5%;
  font-size: 20px;
  font-size: 2.0rem;
  margin-top: -116px;
}
.lecture{
  margin-bottom:50px !important;
}
.lecture h4{
  color:#fff;
  font-weight:bold;
  background:#000;
  padding:10px 0 8px 20px ;
  line-height:1.5em;
  margin-bottom:30px;
}
.lecture .cont-01 {
  padding: 0 4%;
}
.lecture .cont-01 .ttl-list li{
  text-indent:-1em;
  padding-left:1em;
}
.lecture .cont-01 .ttl-list li i{
  display:inline-block;
  background:#f00;
  font-size:14px;
  font-size:1.4rem;
  width:16px;
  height:16px;
  position:relative;
  top:2px;
  right:3px;
  border-radius:50%;
}
.lecture .cont-01 .ttl-list li i span{
  color:#fff;
  font-weight:bold !important;
  display:inline-block;
  position:absolute;
  left: auto;
  right: -20%;
  top:auto;
  bottom:-30%;
}

.lecture .cont-01 .caution {
  font-size: 12px;
  font-size: 1.2rem;
  text-indent: 0;
  line-height: 1.3;
  padding-left: 0;
  margin-top: 10px;
}

.lecture .cont-01 .BL_box {
  color:#1F497D!important;
  border:#1F497D 3px solid;
  padding:1% 3% 3%;
}
.lecture .cont-01 .BL_box a{
  color:#1F497D!important;
}


.cont-02 .img01 {
  margin-top: 50px;
}
.cont-02 .img02,
.cont-02 .txt02 {
  margin-top: 50px;
}
.cont-02 .txt02,
.cont-02 .txt03 {
  font-weight: bold;
  font-size: 20px;
  font-size: 2.0rem;
  line-height: 1.3;
}
.cont-02 .img03,
.cont-02 .txt03 {
  margin-top: 15px;
}
.cont-02 .txt03 a,
.cont-02 .txt03 span {
  font-weight: bold;
}
.cont-02 .txt03 a {
  text-decoration: underline;
}

.button {
  margin-top: 50px;
}
.isDeviceTouch .main-box .inner {
  padding: 0!important;
}


.anchor-btn_movie {
  width: 100%;
  *zoom:1;
  padding:0 5%;
  margin-top: 10px;
  margin-bottom:40px;
}
.anchor-btn_movie:after {
  content: "";
  clear: both;
  display: block;
}

.anchor-btn_movie li {
  display:inline-block;
  width: calc((100% - 4%) / 3);
  margin: 0 0%;
  text-align: center;
}

.anchor-btn_movie li a {
  display: inline-block;
  width: 90%;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  position: relative;
  text-align: center;
  color: #FFF;
  padding: 12px 30px 10px 10px;
  font-size:20px;
  font-size:2.0rem;
  line-height: 1.2;
  text-decoration: none!important;
  font-weight: bold;
}
.anchor-btn_movie li a:after {
  content: "\e900";
  font-family:iconset;
  color: #FFF;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -8px;
  font-size:16px;
  font-size:1.6rem;
}

.anchor-btn_movie li.class01 a{background:#19479e;}
.anchor-btn_movie li.class02 a{background:#20a3a1;}
.anchor-btn_movie li.class03 a{background:#ea5098;}

.class-box:not(:first-child) {
  margin-top: 80px;
}
.class-box .box-wrap {
  padding: 0 2%;
}
.class-box .box-wrap p,
.class-box .box-wrap + .DL_btn {
  margin-left:2%;
}
.class-box .colLBLU {
  color: #168ed2;
}
.class-ttl {
  -webkit-border-radius: 5px;
          border-radius: 5px;
  text-align: center;
  font-size:24px;
  font-size:2.4rem;
  color: #FFF;
  font-weight: bold;
  line-height: 1.2;
  padding: 12px 30px 8px 10px;
  margin-bottom: 20px;
}

#class-1 .class-ttl {
  background: #19479e;
  box-shadow:0px 4px 0px 0px #083385;
  -moz-box-shadow:0px 4px 0px 0px #083385;
  -webkit-box-shadow:0px 4px 0px 0px #083385;
}

#class-2 .class-ttl {
  background: #20a3a1;
  box-shadow:0px 4px 0px 0px #0e8a88;
  -moz-box-shadow:0px 4px 0px 0px #0e8a88;
  -webkit-box-shadow:0px 4px 0px 0px #0e8a88;
}
#class-3 .class-ttl {
  background: #ea5098;
  box-shadow:0px 4px 0px 0px #c03576;
  -moz-box-shadow:0px 4px 0px 0px #c03576;
  -webkit-box-shadow:0px 4px 0px 0px #c03576;
}

.class-sttl {
font-size:18px;
font-size:1.8rem;
font-weight:bold;
margin-bottom:8px;
color:#19479e;
}
.box-wrap + .class-sttl {
border-top:1px solid #ccc;
padding-top:15px;
}
.class-subttl {
  font-size:18px;
  font-size:1.8rem;
  font-weight: bold;
  line-height: 1.2;
  padding-left: 1.0em;
  text-indent: -1.0em;
  margin-bottom: 15px;
  *zoom:1;
}

.class-subttl:after {
  content: "";
  clear: both;
  display: block;
}

.class-subttl i {
  display: inline-block;
  font-size:14px;
  font-size:1.4rem;
  background: #e68012;
  line-height: 1;
  color: #fff;
  float: right;
  padding: 5px 10px;
  text-indent: 0;
  margin-top: -3px;
}

.class-subttl-cate {
  font-size:22px;
  font-size:2.2rem;
  font-weight: bold;
  line-height: 1.2;
  text-indent: -1.0em;
  margin-bottom: 15px;
  margin-top: 20px;
  margin-left: 1.5%;
}

.class-subttl-cate:after {
  content: "";
  clear: both;
  display: block;
}


.class-sub {
  border-bottom: #e83a1e 2px solid;
  background: #fffcdb;
  font-size: 24px;
  font-size: 2.4rem;
  font-weight: bold;
  vertical-align: middle;
  line-height: 1.3;
  padding: 5px 0 0;
  margin-top: 30px;
  margin-bottom: 15px;
}

.class-sub i {
  display: inline-block;
  background: #E83A1E;
  padding: 7px 20px 0;
  margin-top: -5px;
  font-size: 20px;
  font-size: 2.0rem;
  height: 45px;
  color: #fff;
  font-weight: bold;
  margin-right: 15px;
  vertical-align: middle;
  line-height: 1.3;
}
.class-sub i span {
  font-size: 26px;
  font-size: 2.6rem;
  font-weight: bold;

}
.class-box .text {
  line-height: 1.5;
}
.class-box .text p ~ p {
  margin-top: 1em;
}

.class-box .pw {
  position: relative;
  margin-top: 10px;
}
.class-box .pw label{
  position: absolute;
  display: inline-block;
  width: 6.5em;
  top: 3px;
  left: 0;
}
.class-box .pw p {
  padding-left: 6.5em;
}

.class-box .opnepage {
  margin-top: 10px;
  text-align: center;
}

.class-box .opnepage a {
  background: #168ED2;
  display: inline-block;
  -webkit-border-radius: 5px;
          border-radius: 5px;
  box-shadow:3px 4px 0px 0px #efefef;
  -moz-box-shadow:3px 4px 0px 0px #efefef;
  -webkit-box-shadow:3px 4px 0px 0px #efefef;
  color: #FFF;
  line-height: 1;
  padding: 12px 25px 12px 8px;
  position: relative;
  width: 70%;
  text-decoration: none!important;
}

.class-box .opnepage a:hover {
    opacity: .7;
  }
.class-box .opnepage a:after {
    content: "\e905";
    font-family: iconset;
    font-size:14px;
    font-size:1.4rem;
    position: absolute;
    top: 50%;
    right: 8px;
    margin-top: -7px;
  }

.class-box .pwbox {
  margin-top: 20px;
}
.class-box .pwbox .pw {
  float: left;
  width: 300px;
}
.class-box .pwbox .opnepage {
  float: left;
  width: 31.83333333%;
  margin-top: 3px;
}
.class-box.notice {
  background: #e7f3fa;
  padding: 30px;
  font-size:0;
}
.class-box.notice .box{
  display:block;
}
.class-box.notice > .box{
  display:inline-block;
  width: 50%;
  vertical-align: top;
  padding:1%;
}
.class-box.notice .text{
  display:block;
  width: 100%;
  font-size:15px;
  font-size:1.5rem;
}

.class-box.notice .text p ~ p {
  margin-top: 1em;
}

.class-box.notice .covid19_info{
  display:inline-block;
  width: 50%;
  vertical-align:top;
}
.class-box.notice .covid19_info{
  padding-left:30px;
}
.class-box.notice .covid19_info h3{
  color:#FF6411;
}
.class-box.notice .covid19_info .text{
  font-size:14px;
  font-size:1.4rem;
}






/////*
======
SP
======
*/////



.winSP #contents {
  font-size:14px;
  font-size:1.4rem;
  line-height: 1.6;
}

.winSP .main.inner {
  padding: 0;
}
.winSP .main .txt {
  line-height: 1.5;
  font-size: 14px;
  font-size: 1.4rem;
  font-weight: normal;
  padding: 25px 5%;
  margin-top: -30px;
}
.winSP .content-box {
  padding: 15px 0 0;
}

.winSP .cont-01 {
  margin: 0;
  padding: 0 5%
}
.winSP .lecture .cont-01 .ttl-list li i span{
  right: -5%;
  bottom:-25%;
}

.winSP .class-box .box-wrap p,
.winSP .class-box .box-wrap + .DL_btn {
  margin-left:0 !important;
}
.winSP .class-box .box-wrap + .DL_btn a{
  display:block;
  text-align:center;
}


.winSP .cont-02 .img01 {
  margin-top: 20px;
}
.winSP .cont-02 .img02,
.winSP .cont-02 .txt02 {
  margin-top: 30px;
}
.winSP .cont-02 .txt02,
.winSP .cont-02 .txt03 {
  font-size: 18px;
  font-size: 1.8rem;
}
.winSP .cont-02 .img03,
.winSP .cont-02 .txt03 {
  margin-top: 10px;
}

.winSP .button {
  margin-top: 30px;
}



.winSP .anchor-btn_movie {
  padding:0 ;
}

.winSP .anchor-btn_movie li {
  width: 48%;
  margin: 0.5%;
}

.winSP .anchor-btn_movie li a {
  padding: 10px 20px 8px 8px;
  font-size:14px;
  font-size:1.4rem;
  width: 100%;
}
.winSP .anchor-btn_movie li a:after {
  margin-top: -7px;
  font-size:14px;
  font-size:1.4rem;
}


.winSP .class-box {
  margin-top: 50px;
}
.winSP .class-box .box-wrap {
  padding: 0 ;

}
.winSP .class-ttl {
  font-size:20px;
  font-size:2.0rem;
  padding: 10px 0 8px;
  margin-bottom: 15px;
}

.winSP .class-subttl {
  font-size:16px;
  font-size:1.6rem;
  margin-bottom: 8px;
}

.winSP .class-subttl-cate {
  font-size:18px;
  font-size:1.8rem;
  margin-bottom: 8px;
}


.winSP .class-sub {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.3;
  margin-top: 30px;
  margin-bottom: 10px;
}
.winSP .class-sub i {
  padding: 7px 10px 0;
  font-size: 16px;
  font-size: 1.6rem;
  height: 38px;
  margin-right: 8px;
}
.winSP .class-sub i span {
  font-size: 20px;
  font-size: 2.0rem;

}
.winSP .class-ttl + .class-sub {
  margin-top: 10px;
}
.winSP .class-box .opnepage {
  margin-top: 8px!important;
}
.winSP .class-box .opnepage a {
  width: 100%;
}

.winSP .class-box .opnepage a:hover {
    opacity: 1;
  }
.winSP .class-box .opnepage a:after {
    right: 10px;
  }

.winSP .class-box .box-wrap.box-xs-1 .box:nth-child(n+2) {
  margin-top: 20px!important;
}


.winSP .class-box .pwbox {
  margin-top: 20px;
}
.winSP .class-box .pwbox .pw {
  float: none;
  width: 100%;
}
.winSP .class-box .pwbox .opnepage {
  float: none;
  width: 100%;
}





.winSP .class-box.notice {
  padding: 10px;
}
.winSP .class-box.notice > .box{
  display:block;
  width: 100%;
  padding:0;
}

.winSP .class-box.notice .covid19_info{
  padding-left:0px;
  width: 100%;
}
.winSP .class-box.notice .thum{
  width: 100%; margin: 10px 0;
}







/////*
======
TB
======
*/////



.isDeviceTB .main.inner{
  padding: 0;
}

.isDeviceTB .main .txt {
  padding: 40px 5%;
  margin-top: -65px;
}

.isDeviceTB .content-box.bg {
  margin: 0 -10px 0;
  padding: 30px 10px 0;
}