@charset "UTF-8";

.contswrap img{
	vertical-align: bottom;
}
.contswrap .clearfix {
    zoom:1;/*for IE 5.5-7*/
}
.contswrap .clearfix:after {/*for modern browser*/
    content:".";
    display: block;
    height:0px;
    clear:both;
    visibility:hidden;
}

.contswrap *{margin:0; padding:0;}


.contents{
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
	padding: 1% 3%;
	text-align: center;
	background-image: url(../images/back-summer.jpg);
	background-repeat: repeat;
  background-size: cover;
}


.contswrap1 .wrap{
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 3%;
}

.contswrap1 .wrap img, 
.contswrap3 .wrap img{
	text-align: center;
	margin: 0 auto  1rem;
}

.contswrap1 .wrap .botton{
	max-width: 750px;
  margin: 2rem auto 1rem;
}

.contswrap1 .wrap .campaing
 {max-width: 610px;
	margin: 3rem auto;
}

.contswrap3 .wrap{
  max-width: 795px;
  margin: 0 auto;
	padding: 5% 0 0 0;
}

.contswrap3 .bnr{
  max-width: 1100px;
}

.contswrap3 img{
max-width: 550px;
}


.window {
  /* モーダル全体 */
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
  z-index: 1000;
}

.overlay {
  /* 背景のオーバーレイ */
  width: 100%;
  height: 100%;
  margin: 0;
  background-color: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 101;
}

.modal-inner {
  /*コンテンツ領域 */
  display: inline-block;
  height: auto;
  max-height: calc(100vh - 80px);
  margin: 0 15px;
  position: relative;
  z-index: 102;
}

.modal-wrap {
  /* コンテンツ単一 */
  width: 100%;
  max-width: 960px;
  margin-bottom: 30px;
  padding: 30px 30px 60px;
  background-color: #fff;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}


input[type=radio] {
  /* モーダル機能部分 */
  display: none;
  opacity: 0;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}
input[type=radio].handle + .modal-wrap {
  display: none;
}
input[type=radio].handle:nth-of-type(1):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(2):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(3):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(4):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(5):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(6):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(7):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(8):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(9):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(10):checked + .modal-wrap {
  display: block;
}
input[type=radio].handle:nth-of-type(11):checked + .modal-wrap {
  display: block;
}
input[type=radio]#close:checked ~ .window, input[type=radio]#close:checked ~ .close, input[type=radio]#close:checked ~ .overlay, input[type=radio]#overlay:checked ~ .window, input[type=radio]#overlay:checked ~ .close, input[type=radio]#overlay:checked ~ .overlay {
  display: none;
}

label img{
  cursor:pointer;
}


label img{
	max-width: 70%;
	margin: 3em auto 0;
}

.kanshu{
  width: 100%;
  max-width: 1200px;
  text-align: right;
}

/* フェードインその場で */
.fadeIn{
  animation-name:fadeInAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
  opacity:0;
  }
  
  @keyframes fadeInAnime{
    from {
      opacity: 0;
    }
  
    to {
      opacity: 1;
    }
  }