@charset 'UTF-8';

/* site_info
--------------------------------------------------*/
.site_info{
 width:100%;
 box-sizing: border-box;
 padding:3% 0;
 position:relative;
 background-color:#F2F2F2;
}

@media screen and (max-width: 810px) {
.site_info{
  padding:3% 2% 5%;
}
}

@media screen and (max-width: 568px) {
.site_info{
  padding:8% 2% 8%;
}
}

.site_info h2{
 text-align: center;
 font-size:2.2em;
 margin-bottom:2%;
 font-size:2.2em;
 font-family: 'Noto Sans Japanese', sans-serif;
 font-weight:600;
 color:#000;
}

@media screen and (max-width: 810px) {
.site_info h2{
 font-size:1.8em;
}
}

@media screen and (max-width: 568px) {
.site_info h2{
 font-size:1.5em;
 margin-top:2%;
}
}

.kinken{
 width:100%;
 margin:2% auto;
 max-width:580px;
}

.kinken img{
 width:100%;
 height:auto;
}

.site_info .catch span{color:#C4111A;}

.site_info .catch{
 font-size:1.1em;
 line-height:2;
 font-family: 'Noto Sans Japanese', sans-serif;
 font-weight: 400;
 text-align: center;
}

@media screen and (max-width: 568px) {
.site_info .catch{
 font-size:0.95em;
 line-height:1.8;
}
}

/* .watch-box
-------------------------------------------------- */
.watch-box{
  padding:2% 0 0;
  width:100%;
  background :#FFF;
  position:relative;
}

.watch-box:before{display:block;position:absolute;top:-17px;left:50%;width:68px;height:17px;margin-left:-34px;background:url(../images/course_bg_arw.png);content:''}

@media screen and (max-width: 1280px) {
.watch-box{
 padding:2.5% 2% 3%;
 box-sizing:border-box;
}
}

@media screen and (max-width: 810px) {
.watch-box{
 padding:5% 2%;
}
}

@media screen and (max-width: 568px) {
.watch-box{
 padding:5% 0;
}
}

.watch-box h3{
  width:100%;
  margin: 0 auto 5%;
  box-sizing: border-box;
  font-size:2em;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-weight:500;
  text-align: center;
  color:#C4111A;
}

@media screen and (max-width: 810px) {
.watch-box h3{
  font-size:1.8em;
  line-height:1.4;
}
}

@media screen and (max-width: 568px) {
.watch-box h3{
  font-size:1.25em;
  margin: 0 auto 0;
}
}

.watch_tx{
 text-align: center;
 margin: 0 auto 1%;
 font-size:1.1em;
 line-height:2;
 font-family: 'Noto Sans Japanese', sans-serif;
 font-weight: 400;
}

@media screen and (max-width: 568px) {
.watch_tx{
 font-size:0.95em;
 line-height:1.8;
 margin: 2% 3% 1%;
}
}

.rn-moku{
  text-align:center;
  margin:4% auto;
  width:100%;
}

.rn-moku li{
  padding: 2% 2.5%;
  width:33.333%;
  box-sizing: border-box;
  display:inline-block;
  vertical-align: top;
}

@media screen and (max-width: 810px) {
.rn-moku li{
  width:50%;
  padding: 1% 2%;
}
}

.rn-moku li img.img-circle.cir-img {
  width: 96%;
  height: auto;
  margin:0 auto;
  box-sizing: border-box;
  transition: all 1s;
}

@media screen and (max-width: 568px) {
.rn-moku li img.img-circle.cir-img {
  width: 100%;
}
}

.rn-moku li img.img-circle{border-radius:50%}

.rn-moku li .thumbnail {
  background: transparent;
  border: 0;
}

.rn-moku li .p_name {
  margin:20px 0 12px;
}

@media screen and (max-width: 810px) {
.rn-moku li .p_name {
  margin:15px 0 7px;
}
}

.p_name p{
  line-height:1.2;
  font-size:1.1em;
  font-family: 'Noto Sans Japanese', sans-serif;
  font-weight:500;
}

@media screen and (max-width: 568px) {
.p_name p{
  font-size:0.9em;
}
}

.rn-moku li img.pp-sc {
  border: 5px solid #FEE8FF;
}

.thumbnail:hover .pp-sc{
  border: 5px solid #F0A7F5;
}

.rn-moku li img.pk-sc {
  border: 5px solid #FEE7F9;
}

.thumbnail:hover .pk-sc{
  border: 5px solid #FCBFF0;
}

.rn-moku li img.ore-sc {
  border: 5px solid #FDE1AA;
}

.thumbnail:hover .ore-sc{
  border: 5px solid #F6B128;
}

.rn-moku li img.aka-sc {
  border: 7px solid #FFD1E1;
}

.thumbnail:hover .aka-sc{
  border: 7px solid #FAB3CC;
}

@media screen and (max-width: 568px) {
.rn-moku li img.aka-sc {
  border: 4px solid #FFD1E1;
}

.thumbnail:hover .aka-sc{
  border: 4px solid #FAB3CC;
}
}

.rn-moku li img.blu-sc {
  border: 5px solid #D2F1FF;
}

.thumbnail:hover .blu-sc{
  border: 5px solid #6FC9F3;
}

.rn-moku li img.gre-sc {
  border: 5px solid #D3FFF1;
}

.thumbnail:hover .gre-sc{
  border: 5px solid #92EFD2;
}

.p_name .pp{
  color:#75077C;
}

.p_name .pk{
  color:#E475CE;
}

.p_name .ore{
  color:#FFAA00;
}

.p_name .aka{
  color:#C4111A;
}

.p_name .blu{
  color:#0B86BF;
}

.p_name .gre{
  color:#1EB686;
}

.p_tx{
  padding:0.5% 2.5%;
  color:#000;
  line-height:1.6;
  font-size:14px;
  text-align:left;
  letter-spacing:0.05em;
}

@media screen and (max-width: 810px) {
.p_tx{
  padding:0 0;
  letter-spacing:0em;
}
}

@media screen and (max-width: 568px) {
.p_tx{
  font-size:12px;
  line-height:1.4;
  padding:0.5% 3.5%;
}
}

.rnt_bt{text-align:center;margin-top:15px;}
@media screen and (max-width: 568px) {
.rnt_bt{
  margin-top:7px;margin-bottom:15px;
}
}


.rnt_bt a{color:#000;text-decoration:none;font-size:12px;display:inline-block;padding:7px 14px 5px;background-color:#fff;border:1px solid #ddd;-webkit-border-radius:15px;-moz-border-radius:15px;border-radius:15px;}
.rnt_bt a:hover{color:#000text-decoration:none;background-color:#f5f5f5;}


@media screen and (max-width: 568px) {
.rnt_bt a{
  padding:7px 0;
  display:block;
}
}