@charset "utf-8";

/* 
 *  font-size:    83% = 10px
 *  font-size:   100% = 12px
 *  font-size:   117% = 14px
 *  font-size:   133% = 16px
 *  font-size:   150% = 18px
 *  font-size:   166% = 20px
---------------------------------------------------------- */


/*  base
---------------------------------------------------------- */
.pt20{ padding-top: 10px !important; }
.pb20{ padding-bottom: 10px !important; }
.taL{ text-align: left !important; }

/*  base
---------------------------------------------------------- */
.modH2Tit{
  color: #ea4d75;
  font-size: 117%;
  font-weight: bold;
}

#contents img{
  max-width: 100%;
}
.conts{
  padding: 15px 10px;
}
.beach p{
  margin: 0;
  padding: 0;
}


/*  layout
---------------------------------------------------------- */
#boxMainv{
  text-align: center;
}
#boxMainv p:nth-child(1){
  padding-top: 20px;
}
#boxMainv p:nth-child(2){
  /*font-size: 83%;*/
}
#boxMainv textarea{
  width: 280px;
  height: 70px;
  margin: 15px auto;
  padding: 5px;
  color: #333;
  font-size: 83%;
  border: 1px solid #dadada;
}
#boxMainv .link02{
  margin: 10px;
}

.roundPinkBorder .roundTitle{
  padding: 10px 17px;
  font-weight: bold;
  border-top: 1px solid #c9c9c9;
  border-bottom: 1px solid #c9c9c9;
  background: #f8e5ea;
}
#boxCircleTalk .roundTitle{
  border-top: none;
}
.boxCircleTit dt{
  margin-bottom: 15px;
}

/* ----- boxCol2 ----- */
.boxCol2{
  overflow: hidden;
}
#boxVocSec01 .boxCol2{
  width: 284px;
  margin: 0 auto;
}
#boxVocSec02{
  margin-top: -30px;
  margin-bottom: -15px;
}
#boxVocSec02 .boxCol2{
  text-align: left;
}
#boxCircleEvent{
  text-align: center;
}
#boxCircleEvent .boxCol{
  text-align: left;
}
.boxCol2L{
  float: left;
}
.boxCol2R{
  float: right;
}
.modColGray{
  margin: 0 0 15px;
  padding: 12px 7px;
  text-align: center;
  border: 1px solid #dadada;
}
.modCol2Gray{
  margin: 0 0 15px;
  padding: 12px 7px;
  text-align: center;
  border: 1px solid #dadada;
}

/* ----- boxVoc ----- */
.boxVoc{
  position: relative;
  margin-bottom: 10px;
  padding: 10px 8px 15px;
  text-align: left;
  border-radius: 10px;
}
.boxVoc p > b{
  color: #e81524;
}
.modVocPink{ background: #fbeff2; }
.modVocYellow{ background: #fdf4e3; }
.modVocGreen{ background: #ecf4e9; }
.modVocPink:after,
.modVocYellow:after,
.modVocGreen:after{
  position: absolute;
  right: 10px;
  bottom: -10px;
}
.modVocPink:after{ content: url(../img/allow1.png); }
.modVocYellow:after{ content: url(../img/allow2.png); }
.modVocGreen:after{ content: url(../img/allow3.png); }

.boxVocFrom{
  height: 30px;
  margin-bottom: 10px;
}
.boxVocFrom span{
  display: inline-block;
  padding: 6px 0 6px 90px;
  font-weight: bold;
}
.modVocF01{ background: url(../img/icon01.png) no-repeat 0 50%; }
.modVocF02{ background: url(../img/icon02.png) no-repeat 0 50%; }
.modVocF03{ background: url(../img/icon03.png) no-repeat 0 50%; }

.wid68{ width: 68px; }
.wid210{ width: 210px; }
.wid100p{ width: 100%; }

.boxJoin{
  margin: 0 10px;
  padding: 15px 0 0;
  text-align: center;
}
#boxCircleTalk .boxJoin{
  padding: 0 0 15px;
}

.modVocSecTit{
  color: #ea4d75;
}
.boxVocSecSubTit{
  overflow: hidden;
}
.boxVocSecSubTit p{
  float: left;
  margin-right: 10px;
}
.boxVocSecSubTit h3{
  float: left;
  padding: 5px 0;
}
.modVocSecSubTit{
  font-weight: bold;
}
.modVocSecSubTit span{
  background: #fff499;
}
.modVocSecSubTitNarrow{
  letter-spacing: -1.2px;
}

/* ----- boxPointIntro ----- */
#boxPointIntro{
  margin: 0 10px;
  padding: 15px 7px;
  text-align: center;
  border: 1px solid #eec0cd;
  background: #fbeff2;
}
#boxPointIntroInner{
  text-align: left;
  margin-bottom: 10px;
}

/* ----- boxRenewalMessage ----- */
#boxRenewalMessage{
  margin: 0 auto 20px;
  text-align: left;
}
#boxRenewalMessage p:nth-of-type(2){
  margin-bottom: 15px;
}
#boxRenewalMessage p:nth-of-type(3){
  margin-bottom: 15px;
  text-align: center;
}