@charset "UTF-8";

/* TOP
=========================================================================================== */

.Section:nth-of-type(1) {
  /* text-align: center; */
  padding-top: 0;
  /* padding-bottom: 190px; */
}
.Section.top {
	background: #3289CA;
	/* background:url(../img/campaign_renga2.png); */
	/* background-position: center; */
	/* background-repeat: repeat; */
	/* background-size: auto; */
	/* position: relative; */
}
.Section.top h1{
 margin-bottom: 10px;
}

@media screen and (min-width: 768px) {
  .Section:nth-of-type(1) {
    padding-top: 0;
    padding-bottom: 30px;
    }
  .Section.top {
    /* background: #3289CA; */
    /* background:url(../img/campaign_renga2.png); */
    /* background-position: center; */
    /* background-repeat: repeat; */
    /* background-size: auto; */
  }

}


/* キャンペーン応募
=========================================================================================== */

.Section.present {
  /* padding: 20px 0 0; */
  background-color: #CCFF66;
}
.Section.present .MainCont {
    display: flex;
    flex-wrap: nowrap;
    flex-direction: column;
    align-items: center;
}
.Section.present .MainCont > div {
  margin: 0 0 15px;
}

@media screen and (min-width: 768px) {

  .Section.present {
	  padding: 30px 15px 20px;
	 }
  .Section.present .MainCont {
		display: flex;
		flex-direction: row;
	}
  .Section.present .MainCont > div.box_date {
      padding: 0px 30px 0;

  }
  .Section.present .MainCont > div > .date {
    font-size: 20px;
      margin: 0 0;
  }
  .Section.present .MainCont > div {
		width: 100%;
    margin-right: 30px;
	}
	.Section.present .MainCont > div:last-of-type {
    margin-right: 0;
	} 
  .Section.present .MainCont > div.item > dl > dd img {
    width: 340px;
    margin: auto;
  }
}

/* メインタブ
==================================================================== */

/*タブ切り替え全体のスタイル*/
.tab-wrap * {box-sizing: border-box; }
.tab-wrap {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  position: relative;
}
  .tab-wrap > .tab-switch {
      display: none;
  }

.tab-wrap > .tab-label {
  border-radius: 5px;
  background-color: #FFF ;
  padding: 7px 10px;
  margin-top: 15px;
}
.tab-wrap > #TAB-01 + .tab-label {
  margin-top: 0;
}
.tab-wrap > .NOW + .tab-switch + .tab-label,
.tab-wrap > .NEXT + .tab-switch + .tab-label {
  margin-top: 0;
}
.tab-wrap > .tab-content + .NOW,
.tab-wrap > .tab-content + .NEXT{
  margin-top: 15px;
}
.tab-wrap > .NOW {
  border-radius: 5px 5px 0 0;
  background-color: #3289CA;
  width: 100%;
  text-align: center;
  height: 20px;
}
.JS #Contents .tab-wrap > .NOW > img,
.JS #Contents .tab-wrap > .NEXT > img {
  height: 20px; max-width: unset; }

.tab-wrap > .NEXT + .tab-switch + .tab-label,
.tab-wrap > .NOW + .tab-switch + .tab-label{
  border-radius: 0 0 5px 5px;
}
.tab-wrap > .NEXT {
  border-radius: 5px 5px 0 0;
  background-color: #434343;
  width: 100%;
  text-align: center;
  height: 20px;
}
.tab-wrap > .tab-label picture:last-of-type{ display: none; }
.tab-wrap > .tab-switch + .tab-label + .tab-content {
  background-color: #FFF;
  padding: 10px;
  border-radius: 0 0 10px 10px;
  border-top: solid 2px #434343;
  max-width: 410px;
}
.tab-content dt {
  display: none;
}
.tab-wrap > .tab-switch.END + .tab-label{
  background-color: #A1F200;
}
.tab-wrap > .tab-switch.END + .tab-label +.tab-content {
  display: none;
}
.tab-wrap > .tab-switch.END + .tab-label picture { display: none; }
.tab-wrap > .tab-switch.END + .tab-label picture:last-of-type{ display: block;}

/* for - 768px ------------------------------------------*/

@media screen and (min-width: 768px) {
  .tab-wrap > .tab-label {
    margin-top: 5px;
  }
  .tab-wrap > .tab-label {
    width: calc(50% - 20px);
    padding: 10px 91px 10px 5px;
    position: relative;
    margin-left: 28px;
    border: solid 2px #FFF;
    cursor: pointer;
    background-position: right center;
    background-repeat: no-repeat;
  }
  .tab-wrap > .NOW,
  .tab-wrap > .NEXT  {
    max-width: 500px;
    margin-left: 28px;
    width: calc(50% - 20px);
  }
  .tab-wrap > .tab-content + .NOW,
  .tab-wrap > .tab-content + .NEXT{
    margin-top: 5px;
  }
  .tab-wrap > .tab-label:hover {
    border: solid 2px #3289CA;
  }
  .tab-wrap > .tab-switch:disabled+.tab-label {
    border: solid 2px #FFF;
    cursor: auto ;
  }
  .tab-wrap > .tab-switch:checked+.tab-label {
    border: solid 2px #3289CA;
  }
    .tab-wrap > .NEXT + .tab-switch + .tab-label,
	.tab-wrap > .NOW + .tab-switch + .tab-label{
    border-top: none;
  }

  .tab-wrap > .tab-switch:checked+.tab-label:after {
    content: "";
    position: absolute;
    z-index: 2;
    display: inline-block;
    border-style: solid;
    left: -28px;
    top: 14px;
    border-width: 22px 22px 22px 0;
    border-color: transparent #3289CA transparent transparent;
  }
  .tab-wrap > .tab-switch:checked+.tab-label+.tab-content {
    display: inline-block;
    width: calc(50% - 20px);
    background-color: #FFF;
    border-radius: 10px;
    margin-bottom: 0;
    height: 100%;
    border: none;
    max-width: none;
  }
  .tab-wrap > .tab-switch:checked+.tab-label+.tab-content dt {
    display: block;
    background-color: #3289CA;
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    padding: 0px 10px 0px;
    margin-bottom: 10px;
    text-align: left;
  }
  .tab-wrap > .tab-switch:checked+.tab-label+.tab-content dt b{
    font-size: 30px;
  }

  .tab-wrap > .tab-content {
    display: none;
    position: absolute;
    left: 0;
  }
  .tab-wrap .tab-content::after {
      content: none;
  }
  .tab-wrap > .tab-switch.END + .tab-label{
    border: #FDCD1F;
  }

  #TAB-01 + .tab-label { background-image: url(../img/campaign_sub1.png);}
  #TAB-02 + .tab-label { background-image: url(../img/campaign_sub2.png);}
  #TAB-03 + .tab-label { background-image: url(../img/campaign_sub3.png);}
  #TAB-04 + .tab-label { background-image: url(../img/campaign_sub4.png);}
  #TAB-05 + .tab-label { background-image: url(../img/campaign_sub5.png);}
  #TAB-06 + .tab-label { background-image: url(../img/campaign_sub6.png);}
  #TAB-07 + .tab-label { background-image: url(../img/campaign_sub7.png);}
  #TAB-08 + .tab-label { background-image: url(../img/campaign_sub8.png);}
  #TAB-09 + .tab-label { background-image: url(../img/campaign_sub9.png);}
  #TAB-10 + .tab-label { background-image: url(../img/campaign_sub10.png);}
  #TAB-11 + .tab-label { background-image: url(../img/campaign_sub11.png);}
  #TAB-12 + .tab-label { background-image: url(../img/campaign_sub12.png);}

  #TAB-01.END + .tab-label { background-image: url(../img/campaign_sub_end1.png);}
  #TAB-02.END + .tab-label { background-image: url(../img/campaign_sub_end2.png);}
  #TAB-03.END + .tab-label { background-image: url(../img/campaign_sub_end3.png);}
  #TAB-04.END + .tab-label { background-image: url(../img/campaign_sub_end4.png);}
  #TAB-05.END + .tab-label { background-image: url(../img/campaign_sub_end5.png);}
  #TAB-06.END + .tab-label { background-image: url(../img/campaign_sub_end6.png);}
  #TAB-07.END + .tab-label { background-image: url(../img/campaign_sub_end7.png);}
  #TAB-08.END + .tab-label { background-image: url(../img/campaign_sub_end8.png);}
  #TAB-09.END + .tab-label { background-image: url(../img/campaign_sub_end9.png);}
  #TAB-10.END + .tab-label { background-image: url(../img/campaign_sub_end10.png);}
  #TAB-11.END + .tab-label { background-image: url(../img/campaign_sub_end11.png);}
  #TAB-12.END + .tab-label { background-image: url(../img/campaign_sub_end2.png);}

}

/*新規追加
==================================================================== */

.lbltxt {
  color: #FFF;
  letter-spacing: 2px;
  font-weight: 700;
  font-size: 12px;
}
.camtxt {
  color: #002BB4;
  letter-spacing: 1px;
  font-weight: 900;
  font-size: 18px;
}
.emptxt {
  color: #FFF;
  letter-spacing: 1px;
  font-weight: 900;
  font-size: 18px;
  background-color: #002BB4;
  padding: 2px;
  margin: 0 2px;
}
.emptxt.is-verL {
  color: #434343;
  background-color: #FFF100;
  padding: 2px 3px 2px 2px;
}
.bkotxt {
  font-size: 13px;
  line-height: 1.5;
}
.contxt {
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
  margin: 10px 0 0;
}
.taitxt {
  font-size: 14px;
}
.oubbox {
  display: block;
  margin: 10px 0 20px;
  background: #FFF;
  border-radius: 5px;
  padding: 10px;
  text-align: center;
}
.oubbox .item1 {
  padding-bottom: 10px;
  margin: auto;
  max-width: 565px;
}
.opgbox {
  text-align: center;
  border: solid 3px #CCECFF;
  border-radius: 10px;
  background: #FFF;
  margin: 0 0 10px;
}
.opgbox.is-verL {
  border: solid 3px #4CC764;
}
.opgbox.is-verL .c-btn {
    max-width: 90%;
    margin: 0 auto;
}
.opg-title {
  font-size: 16px;
  font-weight: 700;
  background-color: #CCECFF;
  text-align: center;
  padding: 3px 0 0;
  border-radius: 4px 4px 0 0;
}
.opg-title.is-verL {
  background-color: #4CC764;
  color: #FFF;
  padding: 3px 0;
}
/*2024/10/10_TNIS井上 contact/index.html でも使いたかったので下記.is-verR の２つを common.css へ移動
.is-btn.is-verR {}
.icn-arw.is-verR:before {}
*/
.sigtit {
  position: relative;
  font-weight: 900;
  font-size: 16px;
  padding: 5px 0;
  margin: 10px 0 20px;
  border-top: solid 2px #434343;
  border-bottom: solid 2px #434343;
  color: #434343;
}
.sigbox1 {
	margin: 0 auto 10px;
}

/* for - 768px ------------------------------------------*/

@media screen and (min-width: 768px) {
  .lbltxt {
    font-size: 14px;
  }	
  .oubbox {
	margin: 10px 0 30px;
  }
  .taitxt {
    font-size: 16px;
  }	
}

/* for - 897px ------------------------------------------*/

@media screen and (min-width: 897px) {
  .camtxt {
	font-size: 36px;
  }
  .emptxt {
	font-size: 36px;
	padding: 2px 5px;
	margin: 0 5px;
  }
  .emptxt.is-verL {
	font-size: 22px;
	padding: 2px 7px 2px 5px;
	margin: 0 5px;
	}
  .contxt {
    font-size: 14px;
    margin: 20px 0 0;
  }	
  .opgbox {
    margin: 30px auto 0;
    max-width: 70%;
  }
  .oubbox {
	display: flex;
	text-align: center;
  }
  .oubbox .item1 {
    max-width: none;
    width: 45%;
  }
  .oubbox .item2 {
    width: 55%;
  }
  .sigtit {
    font-size: 24px;
    margin: 10px 0 30px;
  }
  .sigbox1 {
	max-width: 70%;
	}
  .sigbox2 {
	max-width: 50.5%;
	}
}

/*既存を名称のみ変更
==================================================================== */
.campaign_in {
    width: 1020px;
    margin: 0 auto;
    padding: 10px 0;
	box-sizing: border-box;
}
.campaign_in.is-ver2 {
    padding: 30px 0 0;
}
@media only screen and (max-width: 896px) {
    .campaign_in {
        width: 100%;
        padding: 10px 17.5px;
    }
    .campaign_in.is-ver2 {
        padding: 20px 2px 10px;
    }	
}

/*top.css から引用
==================================================================== */
.top_ttl {
    margin: 0 0 20px;
}
.top-last {
    font-size: 14px;
    line-height: 1.5;
}
.tpDtl_btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding: 20px 0 0;
}
.tpDtl_btn.is-ver2 {
   -webkit-box-pack: space-around;
   -ms-flex-pack: distribute;
   justify-content: space-around;
   padding: 20px 0;
   margin-top: 10px;
   border-bottom: none;
}
.tpDtl-btn {
    width: 230px;
}
.tpDtl-btn a {
    height: 45px;
    font-size: 16px;
}
.tpDtl_warp {
    border: 2px solid #DDDDDD;
    padding: 35px 35px;
    margin: 0 auto 45px;
}
.tpDtl_warp:last-child {
    /* margin: 0; */
}
.tpDtl-txt {
    font-size: 18px;
    line-height: 1.6;
}

@media only screen and (max-width: 896px) {
    .top_ttl {
        margin: 0 0 15px;
    }
    .top-last {
        font-size: 12px;
    }
    .tpDtl_btn {
        display: -webkit-block;
        display: -ms-block;
        display: block;
        padding: 15px 0 0;
    }
    .tpDtl-btn {
        width: 100%;
        margin: 0 0 15px 0;
    }
    .opgbox .tpDtl-btn {
        width: 90%;
    }
    .tpDtl-btn:last-child {
        margin: 0 auto;
    }
    .tpDtl-btn a {
        height: 55px;
        font-size: 15px;
    }
    .tpDtl_btn.is-ver2 {
        padding: 10px 0;
    }
    .tpDtl_warp {
        padding: 20px 15px;
        margin: 0 0 25px;
    }
    .tpDtl-txt {
        font-size: 14px;
    }
}

/* 対象者・応募方法
=========================================================================================== */
.Section.applicants {
  text-align: center;
}

.Section.applicants .box {
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  column-gap: 15px;
  row-gap: 15px;
  margin: 10px auto;
}
.Section.applicants .box > dl {
  text-align: center;
  border-radius: 10px;
  border: 2px solid #CCECFF;
  /* border: solid; */
  /* border-width: 2px 2px 2px 5px; */
  /* border-color: #FFD661 #FFD661 #FFD661 #FFBE05; */
}

.Section.applicants .box > dl > dt {
  font-size: 20px;
  font-weight: 700;
  text-align: left;
  padding: 3px 0 0 15px;
  border-radius: 4px 4px 0 0;
  color: #434343;
  background: #CCECFF;
  border-bottom: 2px solid #CCECFF;
}
.Section.applicants .box > dl > dd {
  padding: 15px 15px 10px;
  text-align: left;
  /* color: #122A88; */
}
.Section.applicants .box > dl > dd p {
  margin-bottom: 5px;
}
.Section.applicants .box > dl > dd p span{
  background-color: #FFF;
  text-align: center;
  font-size: 12px;
  margin: 0 8px 0 0;
  padding: 2px 5px;
  border: 1px solid black;
}

.Section.applicants2 {
  text-align: center;
  background-color: #F8F8F8;
}
.Section.applicants2 .notice{
  border: 2px solid #DDDDDD;
  text-align: left;
  padding: 15px 15px;
  margin: 10px 0;
}
.Section.applicants2 .notice p {
  margin-bottom: 5px ;
}

@media screen and (min-width: 768px) {
  .Section.applicants{
    padding: 30px 0;
  }
  .Section.applicants .box {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 15px;
    row-gap: 15px;
    margin: 0px auto;
  }
  .Section.applicants2{
    padding: 30px 0;
  }
  .Section.applicants2 .notice{
    padding: 15px 30px;
  }

}


/* （お客様ページのご利用はこちらから）
=========================================================================================== */

.Section.signin {
    /* padding: 35px 15px 0; */
}
.Section.signin .ColumnSet {
  display: block; }
.Section.signin .ColumnSet .ButtonStyle1 {
  margin-bottom: 25px; }
.Section.signin .ColumnSet .FirstItem .ButtonStyle1 a {
  background-color: #fff;
  color: #c20;
  border: 2px solid #c20 ;
  }
.Section.signin .ColumnSet .FirstItem .ButtonStyle1 a strong {
  color: #c20;
  }
.Section.signin .ColumnSet a {
  border-radius: 6px; }
.Section.signin .ColumnSet a strong {
  font-weight: 700; }

.Section.signin {
  background-color: #fff;
  text-align: center;
}
.Section.signin h2 {
  padding: 5px 0;
  margin: 10px 0;
}
.Section.signin h2 span {
  border-top: solid 1px #333;
  border-bottom: solid 1px #333;
  background-color: inherit;
  font-size: 20px;
  padding: 10px 0;
  color: #333;
}

/* よくあるご質問 */
.InfoBox {
  border: solid 1px #ccc;
  text-align: center;
  padding: 20px 20px 0;
 }
.InfoBox ul {
  display: inline-block; }
.InfoBox ul li {
  text-align: left; }

.indent1 {
  text-indent: -1em;
  padding-left: 1em; }
.indent2 {
  text-indent: -2em;
  padding-left: 2em; }


@media screen and (min-width: 768px) {

  .Section.signin {
    text-align: center;
    }
  .InfoBox {
    display: inline-block;
    padding: 30px 20px 0;
    width: 575px; }
  .InfoBox ul {
    display: inline-block; }
  .InfoBox ul li {
    margin-bottom: 10px; }
}