
.head-bg{
  background:url(../img/bg_hero.png)center center;
  background-size: cover;
  background-repeat: no-repeat;
}

.time_schedule .bg-blue{
  background-color:#ddd7eb;
}

.time_schedule .bg-purple{
  background-color:#d8def0f3;
}

.inner{
  max-width:1280px;
  margin:0 auto;
}

@media screen and (max-width: 903px) {
  .inner{
    padding:10px 
  }
}

.mv{
  display:flex;
  justify-content: center;
  margin-top:70px;
}

.mv_block{
  max-width:1280px;
  margin:0 auto 30px;
  display:flex;
  flex-direction:column;
  justify-content: center;
}

@media screen and (max-width: 903px) {
  .mv_block{
    margin:0 auto 15px;
  }
}

.mv_block .main_ttl{
  font-size:4rem;
  font-weight:600;
  color:#fafafa;
  line-height:1.4;
  margin-bottom:20px;
  letter-spacing: -1.3px;
  text-shadow:0 0 4px #000;
}

.mv_block p{
  font-size:1.8rem;
  color:#fafafa;
  margin-bottom:20px;
}

.mv_block a {
	display: flex;
  justify-content: space-evenly;
  align-items: center;
	text-align: center;
	text-decoration: none;
	width: 120px;
  margin-top:20px;
	padding: 10px;
	font-weight: bold;
  background:linear-gradient(45deg, #262ed6, #0a2986);
  cursor: pointer;
	color: #fff;
	position: relative;
}
.mv_block a:before {
	content: '';
	width: 7px;
	height: 7px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: rotate(45deg);
}

.head_wrap{
  padding:0 0 50px;
  background-size: contain;
}

@media screen and (max-width: 903px) {
  .head_wrap{
    margin:0 0 15px;
  }
}

.head_ttl{
  font-size:3.0rem;
  line-height:1.3;
  padding:60px 0 50px;
  text-align:center;
  color:#0a2986;
  font-weight:600;
}

@media screen and (max-width: 903px) {
  .head_ttl{
    font-size:1.6rem;
    line-height:1.3;
    padding:15px 0 0;
  }
}

.head_txt{
  text-align:center;
  font-size:1.8rem;
  font-weight:600;
}

@media screen and (max-width: 903px) {
  .head_txt{
    margin-bottom:15px;
    text-align:left;
    font-size:1.4rem;
    font-weight:500;
  }
}

.event_attention{
  font-size:1.4rem;
  margin-bottom:70px;
}

@media screen and (max-width:903px){
  .event_attention{
    margin-bottom:15px;
  }
}


.navi_event{
  display:flex;
  flex-direction:row;
  margin-bottom:70px;
}

@media screen and (max-width:903px){
  .navi_event{
  display:block;
  margin-bottom:15px;
  }  
}

.navi_event a{
  position:relative;
  width:calc((100% - 50px)/ 3);
  display:inline-block;
  margin-right:25px;
  border:2px solid #0a2986;
    color:#0a2986;
  font-size:1.4rem;
  font-weight:600;
  padding:10px;
  display:block;
  width:100%;
  height:auto;
  background:#fff;
  border-radius:3px;
}

.navi_event a:after{
  position:absolute;
  content:"";
  width:8px;
  height:8px;
  border-top:#0a2986 2px solid;
  border-right:#0a2986 2px solid;
  display:inline-block;
  top:50%;
  right:35px;
  transform: rotate(135deg);
  margin-top:-4px;
}

.navi_event a:last-child{
  margin-right:0;
}

@media screen and (max-width:903px){
  .navi_event a{
    width:100%;
    margin-bottom:10px;
  }
}


.event_list{
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  margin-bottom:120px;
}

@media screen and (max-width: 903px) {
  .event_list{
    margin-bottom:15px;
  }
}

.event_list_item{
  display:flex;
  flex-direction:column;
  width:calc((100% - 90px)/ 4);
  margin:0 30px 30px 0;
  box-shadow: 0 0 8px rgba(192, 192, 192, 0.8);
  background:#fff;
  border-radius: 3px;
}

@media screen and (max-width: 903px) {
  .event_list_item{
    display:column;
    margin:0 0 10px;
    width:100%;
  }
}

.event_list_item a{
  display:block;
  width:100%;
  height:100%;
}

.event_list_item a:hover{
  opacity:0.7;
  transition: all 0.3s;
}


.event_list_item:nth-child(4n){
  margin-right:0;
}
.mv_block .main_ttl
.event_list_item_img{
  position:relative;
}

.event_list_item_img span{
  position:absolute;
  top:0;
  left:0;
  font-size:1.2rem;
  display:inline-block;
  padding:8px 8px;
  color:#fff;  
}

.event_list_item_img span.blue{
  background:linear-gradient(45deg, #262ed6, #0a2986);
}

.event_list_item_img span.sky{
  background:linear-gradient(45deg, #219ed8, #3aaff3d8);
}



.event_list_wrap{
  padding:15px 15px 0;
}

.event_list_ttl{
  font-size:1.6rem;
  font-weight:600;
  margin-bottom:5px;
}

.event_list_ico_01{
  display:inline-block;
  font-size:1.2rem;
  background:#9eaec3;
  padding:6px;
  margin:0 10px 5px 0;
  border-radius: 3px;
  color:#fff;
}

.event_list_ico_02{
  display:inline-block;
  font-size:1.2rem;
  box-shadow: inset 0 0 0 1px #0a2986;
  padding:6px;
  margin:0 10px 5px 0;
  border-radius: 3px;
  color:#0a2986;
}

.event_list_txt{
  font-size:1.4rem;
  margin:10px 0;
}

.event_list_date{
  font-size:1.4rem;
  color:#848484;
  margin-bottom:6px;
}

.event_list_product{
  font-size:1.2rem;
  border:1px solid #d7d7d7;
  padding:2px 5px;
  display:inline-block;
  margin-bottom:15px;
  border-radius: 3px;
}

.event_list_link{
  display:block;
  position:relative;
  padding-left:20px;
  font-size:1.4rem;
  margin:0 0 15px 0;
  margin-top:auto;
}

.event_list_link:before{
  position:absolute;
  content:"";
  width:8px;
  height:8px;
  border-top:2px solid #848484;
  border-right:2px solid #848484;
  margin:auto;
  top:0;
  bottom:0;
  left:0;
  transform: rotate(45deg);
}

.event_tbl{
  border-top:1px solid #dedede;
  width:100%;
  margin-bottom:30px;
}

.event_tbl a{
  color:#0a2986;
}

.event_tbl a:hover{
  color:#0a2986;
  text-decoration: underline;
  transition: all 0.3s;
}



.event_tbl .tbl_group01{
  width:28%;
}

.event_tbl .tbl_group02{
  width:72%;
}

.event_tbl th{
  background:#eee;
  border-right:#dedede;
}

.event_tbl th,.event_tbl td{
  padding:20px;
  border-bottom:1px solid #dedede;
  font-size:1.6rem;
  border-right:1px solid #dedede;
}

@media screen and (max-width: 903px) {
  .event_tbl th,.event_tbl td{
    padding:10px;
    border-bottom:1px solid #dedede;
    font-size:1.4rem;
  }
}

.event_tbl_attention{
  margin-bottom:70px;

 }

 .event_tbl_attention li{
  position:relative;
  padding-left:25px;
  font-size:1.4rem;
 }

 .event_tbl_attention li:before{
  position:absolute;
  content:"※";
  display:block;
  left:0;
  top:0
 }

.access_txt{
  margin-bottom:50px;
}

.access_map{
  max-width:650px;
  margin:0 auto 50px;
}

.access a{
  color:#0a2986;
}

.access a:hover{
  text-decoration: underline;
}

.product_list{
  display:flex;
  flex-direction:row;
  flex-wrap: wrap;
  margin-bottom:130px;  
}

@media screen and (max-width: 903px) {
  .product_list{
    display:block;
    margin-bottom:20px;  
  }
}

.product_item{
  width: calc((100% - 75px) / 3);
  margin:0 25px 15px 0;
  padding:20px;
  box-shadow: rgba(192, 192, 192, 0.8) 0px 0px 8px;
}

@media screen and (max-width: 903px) {
  .product_item{
    width: 100%;
    margin:0 0 15px 0;
  }
}

.product_item a{
  width:100%;
  height:auto;
  display:block;
}

.product_item a:hover{
  opacity:0.8;
  transition: all 0.3s;
}

.product_item:nth-child(3n){
  margin-right:0;
}

.product_item_ttl{
  font-weight:600;
  padding-bottom:5px;
  margin-bottom:15px;
  border-bottom:2px solid #eee;
}

.product_item_copy{
  font-size:1.4rem;
  font-weight:600;
  margin-bottom:10px;
}

.product_item_txt{
  font-size:1.4rem;
  margin-bottom:15px;
}

.product_item_link_txt{
  position:relative;
  padding-left:15px;
  font-size:1.4rem;
}

.product_item_link_txt:before{
  position: absolute;
  content: "";
  width: 8px;
  height: 8px;
  top: 0;
  bottom: 0;
  left: 0;
  transform: rotate(45deg);
  border-top: 2px solid rgb(132, 132, 132);
  border-right: 2px solid rgb(132, 132, 132);
  margin: auto;
  display:inline-block;
}



  .tabs {
    display: flex;
    flex-wrap: wrap;
  }
  
  .tab_label {
    color: #0a2986;
    border: solid 1px #0a2986;
    position: relative;
    z-index: 1;
    cursor: pointer;
    flex: 1;
    padding: 10px;
    margin: 0 5px; 
    border-radius: 3px;
  }
  
  .tab_label:hover {
    opacity: 0.75;
    transition: all 0.3s;
  }
  
  .tab_content {
    flex: 100%;
    display: none;
    overflow: hidden;
  }

  .tab_content a{
    color:#0a2986;
  }

  .tab_content a:hover{
    color:#0a2986;
    text-decoration: underline;
  }
  
  input[name="tab_switch"] {
    display: none;
  }
  
  .tabs input:checked + .tab_label {
    color: #fff;
    background:#0a2986;
  }
  .tabs input:checked + .tab_label::after {
    content: '';
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px 8px 0 10px;
    border-color: #0a2986 transparent transparent transparent;
    display: block;
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    transition: all 0.3s ease 0s;
  }
  
  #tab01:checked ~ #tab01_content,
  #tab02:checked ~ #tab02_content,
  #tab03:checked ~ #tab03_content {
    display: block;
  }
  
  .tab_content{
    position: relative;
    animation: fadeIn 1s ease;
  }

  .time_schedule table{
    border-bottom:1px solid #bebebed2;
    border-right:1px solid #bebebed2;
    width:100%;
    margin:50px 0;
    font-size:1.4rem;
  }

  .time_schedule  table td, .time_schedule  table th{
    border-top:1px solid #bebebed2;
    border-right:1px solid #bebebed2;
    border-left:1px solid #bebebed2;
    padding:10px;
  }

  .time_schedule  table th{
    text-align:center;
    width:calc(100% / 6);
    background:rgb(230, 230, 230);
  }

  .time_schedule  table td{
    vertical-align: middle;
  }

  .link_btn_wrap{
    display:flex;
    justify-content: center;
  }

  .link_btn{
    display:inline-block;
    padding:10px 30px;
    background:#0a2986;
    color:#fff;
    position:relative;
    text-align:center;
  }

  @media screen and (max-width: 903px) {
    .link_btn{
      width:100%;
    }
  }

  .link_btn:before{
    position:absolute;
    content:"";
    width:8px;
    height:8px;
    border-top:2px solid #fff;
    border-right:2px solid #fff;
    transform: rotate(45deg);
    left:10px;
    top:50%;
    margin-top:-4px;
  }

  .close_wrap{
    box-shadow: 2px 2px 8px #ccc;
    padding:30px;
  }

  @media screen and (max-width: 903px) {
    .close_wrap{
      padding:15px;
    }
  }

  .close_ttl{
    font-size:2.0rem;
    font-weight:600;
    padding-bottom:20px;
    margin-bottom:20px;
    border-bottom:1px solid #333;
    text-align:center;
  }

  @media screen and (max-width: 903px) {
    .close_ttl{
      font-size:1.6rem;
      padding-bottom:10px;
      margin-bottom:10px;
    }
  }

  .section02{
    padding:70px 0 70px;
  }

  .third_ttl {
    font-size: 2rem;
    font-weight: 600;
    margin-bottom: 30px;
    padding-bottom: 5px;
}

.time_schedule{
  margin:70px 0;
}

.event_outline{
  padding:70px 0;
}

@media screen and (max-width: 630px) {
  .slider {
    overflow: auto;
    margin-left: 66px;
  }
}

  .event_outline_list{
    list-style-type: disc;
    list-style-position: outside;
     padding-left: 20px;
  }

.event_outline_item{
 padding-left: 1rem;
  text-indent: -1rem;
  }