@charset "UTF-8";

/* 募集ページ用CSS
---------------------------------------------------- */
img{display:block;}
#header img, #mainContents img{display:inline;}

#tokutenTtl{padding-bottom:50px;text-align:center;}
#tokutenTtl .sub{display:block;padding-bottom:10px;font-size:18px;line-height:1.6;}
#tokutenTtl .sub span{display:block;font-size:28px;}
#tokutenTtl .main{display:inline-block;padding:5px 0;font-size:32px;color:#fff;line-height:1.4;letter-spacing:0.05em;
  background:#666;
  background: -moz-linear-gradient(left, rgba(51,51,51,0) 0%, rgba(51,51,51,0.8) 50%, rgba(51,51,51,0) 100%);
  background: -webkit-linear-gradient(left, rgba(51,51,51,0) 0%,rgba(51,51,51,0.8) 50%,rgba(51,51,51,0) 100%);
  background: linear-gradient(to right, rgba(51,51,51,0) 0%,rgba(51,51,51,0.8) 50%,rgba(51,51,51,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00333333', endColorstr='#00333333',GradientType=1 );
}
#tokutenTtl .main span{display:inline-block;padding:8px 4em;
  background:#333;
  background: -moz-linear-gradient(left, rgba(51,51,51,0) 0%, rgba(51,51,51,0.8) 50%, rgba(51,51,51,0) 100%);
  background: -webkit-linear-gradient(left, rgba(51,51,51,0) 0%,rgba(51,51,51,0.8) 50%,rgba(51,51,51,0) 100%);
  background: linear-gradient(to right, rgba(51,51,51,0) 0%,rgba(51,51,51,0.8) 50%,rgba(51,51,51,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00333333', endColorstr='#00333333',GradientType=1 );
}

#tokutenArea{max-width:1180px;padding:30px;margin:0 auto 60px;border:1px solid #666;background:#fff;overflow:hidden;box-sizing:border-box;text-align:center;}
#tokutenArea img{width:100%;max-width:100%;}
#tokutenArea .left{float:left;width:52.4%;margin-right:3%;text-align:center;}
#tokutenArea .right{float:left;width:39.5%;}

#tokutenInfo{display:table;margin:0 auto 40px;}
#tokutenInfo h3,
#tokutenInfo .text{display:table-cell;vertical-align:middle;}
#tokutenInfo h3{position:relative;font-size:18px;padding:20px;color:#fff;text-align:center;line-height:1.4;background:#a00;white-space:nowrap;}
#tokutenInfo h3:after{content:"";display:block;position:absolute;right:-10px;top:50%;margin-top:-5px;width:0;height:0;border-style:solid;border-width:5px 0 5px 10px;border-color:transparent transparent transparent #a00;}
#tokutenInfo .text{padding-left:30px;}
#tokutenInfo .quo{padding-bottom:10px;font-size:18px;line-height:1.4;}
#tokutenInfo .quo strong{display:inline-block;margin:0 5px;color:#a00;font-size:105%;}
#tokutenInfo .quo span{display:inline-block;font-size:80%;}
#tokutenInfo .note{padding-left:1em;text-indent:-1em;}

.joinBnts{text-align:center;}
.joinBnts .joinTtl{font-size:26px;position:relative;padding:20px 0 10px 0;}
.joinBnts .joinTtl:after{content: "";position:absolute;display:block;bottom:0;left:50%;width: 100px;height: 4px;margin-left:-50px;background:#333;}
.joinBnts .joinTtl .main{display:inline-block;position:relative;}
.joinBnts .joinTtl .sub{display:block;position:absolute;width:6em;padding:1.2em 0;top:-20px;left:105%;font-size:11px;color:#fff;text-align:center;line-height:1.2;background:#a9a651;border-radius:100%;}
.joinBnts .lead{padding-top:20px;font-size:16px;}
.joinBnts ul{padding-top:20px;}
.joinBnts ul li{display:inline-block;margin:5px 10px;vertical-align:middle;}
.joinBnts ul li a{display:block;padding:15px 40px;font-size:22px;font-weight:bold;color:#fff;background:#c31515;text-decoration:none;border-radius:3px;box-shadow:0 0 5px rgba(255,255,255,0.6) inset;border:1px solid #c31515;transition:background .15s linear, border .15s linear;}
.joinBnts ul li a:hover{background:#333;border-color:#333;}
.joinBnts ul li.wide a{padding-left:50px;padding-right:50px;}
.joinBnts ul li a span{display:inline-block;margin-left:15px;padding:3px 15px;font-size:70%;background:#800b0b;border-radius:3px;transition:background .15s linear,color .15s linear;}
.joinBnts ul li a:hover span{background:#fff;color:#c31515;}

#contentsInfo{padding-top:80px;}
.contentsID{text-align:center;}
.contentsID span{display:block;padding-top:10px;font-size:18px;}
.contentsList{margin-left:-20px;overflow:hidden;}
.contentsList li{float:left;width:25%;padding-top:40px;}
.contentsList .item{padding-left:20px;}
.contentsList .image{position:relative;}
.contentsList .image img{width:100%;max-width:100%;}
.contentsList #abenobear{position:absolute;width:35.3%;z-index:5;right:-20px;bottom:-30px;}
.contentsList .item h4{padding:10px 0 5px;font-size:16px;}
#contentsInfo .andmore{padding-top:40px;text-align:center;font-size:20px;font-weight:bold;}

#contactMail{max-width:1000px;padding:10px;margin:80px auto 0;font-size:14px;font-weight:bold;text-align:center;border:1px solid #ccc;}
#contactMail a{color:#a9a651;}

@media only screen and (max-width:1300px) { /* contentsList調整 */
  .contentsList{margin-left:-30px;}
  .contentsList li{width:50%;}
  .contentsList li:nth-child(2n+1){clear:both;}
  .contentsList .item{padding-left:30px;}
  .contentsList .item h4{font-size:18px;}
  .contentsList .item p{font-size:14px;}
}

/* for SP
--------------------------------------------------*/
@media only screen and (max-width:749px) { /* smartphone size */
  #tokutenTtl{padding-bottom:30px;}
  #tokutenTtl .sub{font-size:14px;line-height:1.4;}
  #tokutenTtl .sub span{font-size:18px;}
  #tokutenTtl .main{display:block;max-width:20em;padding:3px 0;margin:0 auto;font-size:22px;}
  #tokutenTtl .main span{display:block;padding:8px 0;}

  #tokutenArea{padding:15px;margin-bottom:30px;}
  #tokutenArea .left{width:54.6%;margin-right:1.68%;}
  #tokutenArea .right{width:41.17%;}
  
  #tokutenInfo{margin:0 auto 20px;}
  #tokutenInfo h3{font-size:16px;padding:10px;}
  #tokutenInfo .text{padding-left:20px;}
  #tokutenInfo .quo{font-size:16px;}
  #tokutenInfo .note{font-size:12px;}

  .joinBnts .joinTtl{font-size:22px;position:relative;padding:20px 0 15px 0;}
  .joinBnts .joinTtl .sub{display:block;position:absolute;width:5em;padding:.7em 0;font-size:10px;}
  .joinBnts .lead{padding-top:20px;font-size:13px;}
  .joinBnts ul{padding-top:20px;margin:0 auto;overflow:hidden;}
  .joinBnts ul li{width:33.33%;margin:0;padding:5px 0;line-height: 1.4;}
  .joinBnts ul li a{padding:12px 5px;margin:0 5px;font-size:18px;transition:none;}
  .joinBnts ul li a:hover{background:#c31515;border-color:#c31515;}
  .joinBnts ul li.wide a{padding-left:12px;padding-right:12px;}
  .joinBnts ul li a span{display:block;max-width:10em;margin: 8px auto 0;}
  .joinBnts ul li a:hover span{background:#800b0b;color:#fff;}
  .joinBnts ul.wide{overflow:hidden;max-width:400px;}
  .joinBnts ul.wide li{width:50%;}
  .joinBnts ul.wide li.wide{width:100%;}

  #contentsInfo{padding-top:40px;}
  .contentsID img{max-width:80%;}
  .contentsID span{font-size:14px;}
  .contentsList{margin-left:-20px;overflow:hidden;}
  .contentsList li{padding-top:30px;}
  .contentsList .item h4{font-size:15px;}
  #contentsInfo .andmore{padding-top:30px;}

  #contactMail{margin:40px auto 0;font-size:12px;text-align:left;}
  #contactMail a{color:#a9a651;}
}

@media only screen and (max-width:520px) { /* smartphone -small size */
  .spNbr{display:none;}
  #tokutenArea .left,
  #tokutenArea .right{float:none;width:auto;margin:0;}
  #tokutenArea .right{padding-top:15px;}
  
  #tokutenInfo{box-shadow:0 0 5px rgba(0,0,0,0.2);}
  #tokutenInfo,
  #tokutenInfo h3,
  #tokutenInfo .text{display:block;}
  #tokutenInfo h3:after{left:50%;right:auto;top:100%;margin-top:0;margin-left:-6px;width:0;height:0;border-width: 7px 6px 0 6px;border-color: #a00 transparent transparent transparent;}
  #tokutenInfo .text{padding:15px;background:#fff;}
  #tokutenInfo .quo{font-size:14px;}
  #tokutenInfo .quo strong{display:inline;}
  
  .contentsList{margin-left:0;overflow:visible;}
  .contentsList li{float:none;width:auto;padding-top:20px;}
  .contentsList .item{padding-left:0;}
  .contentsList .item h4{padding:10px 0 0;font-size:14px;}
  .contentsList #abenobear{width:30%;z-index:5;right:-10px;bottom:-20px;}
  .contentsList .item p{font-size:12px;}
}