body{
  position: relative;
  width: 100%;
  overflow-x:hidden;
  font-family: "TB丸ゴシック DB",sans-serif;
}

header,footer,div,section{
  box-sizing: border-box;
}

img{
  width: 100%;
  height: auto;
}

.img_l{
  width: 100%;
  border-radius:0 160px 0 160px;
  overflow:hidden;
}

.img_s{
  width: 100%;
  border-radius:0 80px 0 80px;
  overflow:hidden;
}

br.sp{display: none;}
br.pc{display: inline;}

h1,h2,h3{
  color: #1c4b90;
}

h1{
  position: relative;
  display: block;
  width: 100%;
  margin:0 auto 134px;
  padding:0 20px;
  font-size: 42px;
  letter-spacing: 0.2em;
  text-align: center;
  box-sizing: border-box;
}


h1:before,
h1:after{
  content: '';
  position: absolute;
  display: block;
  left: 50%;
  width: 100%;
  max-width: 820px;
  height: 42px;
  background:center / 100% auto no-repeat;
}

h1:before{
  top: calc(-100% - 40px);
  transform: translateX(-50%);
  background-image: url('../image/common/h1_border.png');
}

h1:after{
  bottom: calc(-100% - 40px);
  transform: translateX(-50%) rotate(180deg);
  background-image: url('../image/common/h1_border.png');
}

h2{
  padding-bottom: 20px;
  font-size: 32px;
  line-height: 40px;
  letter-spacing: 0.2em;
  background:bottom center / 100% auto no-repeat url('../image/common/h2_border.png');
  box-sizing: border-box;
}

h3{
  display: inline-block;
  width: 100%;
  max-width: 200px;
  height: 43px;
  margin-right: 40px;
  font-size: 20px;
  text-align: center;
  background:bottom center / 100% auto no-repeat url('../image/common/h3_border.png');
}

.box{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 820px;
  margin:0 auto;
  padding:60px;
  border-radius: 10px;
}

@media (max-width:1024px) {
  h1{font-size: 37px;}
  h2{font-size: 28px;}
  h3{font-size: 18px;}
}

/* ==================
      header
================== */
header{
  position: relative;
  width: 100%;
  height: 102px;
  padding:36px 20px 0;
  background-color: #1c4b90;
}

header:before{
  content: '';
  position: absolute;
  bottom: -45px;
  left: 0;
  display: block;
  width: 100%;
  max-width: initial;
  height: 46px;
  background:top center / auto 100% repeat url('../image/common/pattern_01.png');
}

header p{
  display: block;
  width: 100%;
  max-width: 1262px;
  margin:0 auto;
  font-size: 42px;
  color: #fff;
  letter-spacing: 0.2em;
}

@media (max-width:1024px) {
  header{
    position: relative;
    width: 100%;
    height: 91px;
    padding:36px 20px 0;
    background-color: #1c4b90;
  }

  header:before{
    content: '';
    position: absolute;
    bottom: -40px;
    left: 0;
    display: block;
    width: 100%;
    height: 41.4px;
  }

  header p{
    font-size: 37px;
  }
}

/* ==================
      footer
================== */
footer{
  position: relative;
  width: 100%;
  height: 93px;
  padding:40px 20px;
  font-size: 14px;
  letter-spacing: 0.2em;
  text-align: center;
  color: #fff;
  background-color: #1c4b90;
}

footer:before{
  content: '';
  position: absolute;
  top: -25px;
  left: 0;
  display: block;
  width: 100%;
  height: 54px;
  background:center / auto 100% repeat url('../image/common/pattern_03.png');
}

/* ==================
    #top_box
================== */

#top_box{
  position: relative;
  display: block;
  width: 100%;
  max-width: 1920px;
  margin:20px auto 0;
}


#top_box .slide,
#top_box .slide-sp{
  position: relative;
  width: 100%;
  height: 100%;
  padding-top: 33.90625%;
}

#top_box .slide img,
#top_box .slide-sp img{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%,-50%);
  z-index: -1;
  opacity: 0;
  animation: Slide 18s ease infinite;
}

@keyframes Slide {
  0%{ opacity: 0; }
	8%{ opacity: 1; }
	33%{ opacity: 1; }
	41%{ opacity: 0; }
	100%{ opacity: 0; }
}

#top_box .slide img:nth-child(1),#top_box .slide-sp img:nth-child(1){animation-delay: 0s;}
#top_box .slide img:nth-child(2),#top_box .slide-sp img:nth-child(2){animation-delay: 6s;}
#top_box .slide img:nth-child(3),#top_box .slide-sp img:nth-child(3){animation-delay: 12s;}


#top_box .link_box{
  position: absolute;
  bottom:-10.5%;
  left: 50%;
  transform: translateX(-50%);
  width: 77.7%;
  max-width: 1492px;
  padding-top: 76.1083%;
}

#top_box .link_box .flex_box{
  position: relative;
  display: flex;
  justify-content: space-between;
  width: 27.2%;
  max-width: 406px;
  padding-top: 20%;
  margin:0 0 0 auto;
}

#top_box .link_box .flex_box>a{
  display: block;
  position: absolute;
  width: 55.2%;
}

#top_box .link_box .flex_box .left{
  top: 0;
  left: 0;
}

#top_box .link_box .flex_box .right{
  bottom: 0;
  right: 0;
}

#top_box .slide-sp{display: none;}

/* ==================
    #section01
================== */
#section01{
  position: relative;
  width: 100%;
  max-width: 1920px;
  padding:200px 20px;
  margin:0 auto;
  overflow:hidden;
}

#section01 .flex_box{
  position: relative;
  display: flex;
  justify-content:space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 1100px;
  margin:0 auto;
  color: #1c4b90;
  z-index: 1;
}

#section01 .flex_box dt{
  font-size: 42px;
  line-height: 60px;
  letter-spacing: 0.2em;
}

#section01 .flex_box p{
  font-size: 16px;
  line-height: 28px;
}

#section01 .flex_box .right{
  margin-top: 60px;
}

#section01 .flex_box .right p:first-child{
  margin-bottom: 5px;
}

#section01 .flex_box:before,
#section01 .flex_box:after{
  content: '';
  position: absolute;
  display: block;
  width: 1191px;
  height:237px;
  background:center / 100% auto no-repeat;
  z-index: -1;
}

#section01 .flex_box:before{
  top: -147px;
  left: -909px;
  background-image:url('../image/common/bg_01.png');
}

#section01 .flex_box:after{
  bottom: -166px;
  right: -965px;
  background-image:url('../image/common/bg_02.png');
}

@media (max-width:1024px) {
  #section01 .flex_box dt{font-size: 37px;}
}

/* ==================
    #section02
================== */
#section02{
  position: relative;
  width: 100%;
  margin:0 auto;
  padding:240px 20px 0;
  background-color: #fff0e8;
}

#section02:before{
  content: '';
  position: absolute;
  top: -35px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 100%;
  height: 54px;
  background:center / auto 100% repeat url('../image/common/pattern_02.png');
}

#section02 .txt_box{
  width: 100%;
  max-width: 820px;
  margin:0 auto 80px;
  font-size: 20px;
  text-align: center;
  line-height: 34px;
  letter-spacing: 0.2em;
  color: #1c4b90;
}

#section02 .info{
  background-color: #fff;
}

#section02 .info ul{
  font-size: 16px;
  line-height: normal;
  color: #4d4d4d;
}

#section02 .info ul li{
  padding-left: 16px;
  text-indent: -16px;
}

#section02 .info ul li:last-child{
  padding-left: 16px;
  text-indent: 0;
}

#section02 .info ul li span{
  font-size: 14px;
}

/* ==================
      #exp_box
================== */
#exp_box{
  position: relative;
  width: 100%;
  margin:0 auto;
  padding:200px 20px 200px;
  background:top 162px left -320px / 1732px auto no-repeat url('../image/common/bg_03.png');
  background-color: #fff0e8;
}

#exp_box .exp_item{
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1100px;
  margin:0 auto 200px;
}

#exp_box .exp_item p{
  margin:2.083vw 0;
}

#exp_box .exp_item ul{}

#exp_box .exp_item ul li{
  padding-left: 48px;
  text-indent: -48px;
}

#exp_box .exp_item ul li span{
  font-size: 14px;
}

#exp_box .exp_item .large{
  width: 52.7%;
  max-width: 580px;
  order: 0;
}

#exp_box .exp_item .small{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  width: 41.8%;
  max-width: 460px;
  order: 0;
}

#exp_box .exp_item .small .txt_box{
  width: 100%;
  max-width: 380px;
  margin-top: 3.125vw;
  font-size: 16px;
  line-height: normal;
  color: #4d4d4d;
}

#exp_box .exp_item:last-child{
  margin:0 auto;
}

#exp_box .exp_item:nth-child(2n) .large{
  order: 1;
}

#exp_box .exp_item:nth-child(2n) .small{
  order: 0;
}

/* ==================
    #section03
================== */
#section03{
  position: relative;
  width: 100%;
  padding: 200px 20px;
  background-color: #fff;
}

#section03:before{
  content: '';
  position: absolute;
  top: -17px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 100%;
  height: 54px;
  background:center / auto 100% repeat url('../image/common/pattern_02.png');
}

#section03 .flex_box{
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  width: 100%;
  max-width: 1100px;
  margin:0 auto;
  line-height: normal;
  color: #1c4b90;
}

#section03 .flex_box dt{
  font-size: 32px;
}

#section03 .flex_box dd{
  font-size: 16px;
}

#section03 .flex_box .left{
  width: 58%;
  max-width: 640px;
  border-radius: 0 50px 0 50px;
  overflow: hidden;
}

#section03 .flex_box .right{
  width: 31%;
  max-width: 344px;
}

#section03 .reserve{
  margin-top: 140px;
  background-color: #fff0e8;
}

#section03 .reserve p{
  font-size: 18px;
  line-height: normal;
  color: #ec1c24;
}

/* ==================
    #section04
================== */
#section04{
  position: relative;
  padding:405px 20px 200px;
  background-color: #fff2cc;
}

#section04:before{
  content: '';
  position: absolute;
  top: -35px;
  left: 50%;
  transform: translateX(-50%);
  display: block;
  width: 100%;
  height: 54px;
  background:center / auto 100% repeat url('../image/common/pattern_02.png');
}


#section04 .open{
  position: relative;
  width: 100%;
  max-width: 1050px;
  margin:0 auto;
}

#section04 .open .img{
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  transform: translateY(-50%);
  z-index: 2;
}

#section04 .open img{
  width: 168px;
  height: 168px;
}

#section04 .txt_box{
  width: 100%;
  max-width: 820px;
  margin:0 auto 80px;
  font-size: 20px;
  text-align: center;
  line-height: 34px;
  letter-spacing: 0.2em;
  color: #1c4b90;
}


#section04 .flex_box{
  display: flex;
  justify-content:space-between;
  width: 100%;
  max-width: 1100px;
  margin:0 auto;
  font-size: 16px;
  line-height: normal;
}

#section04 .flex_box p{
}

#section04 .flex_box .left{
  margin-right: 40px;
  color: #4d4d4d;
}

#section04 .flex_box .right{
  position: relative;
  width: 52.7%;
  max-width: 580px;
  overflow: hidden;
  border-radius: 0 160px 0 160px;
}

#section04 .flex_box .right p{
  position: absolute;
  bottom: 20px;
  right: 20px;
  font-size: 12px;
  color: #fff;
}

#section04 .flex_box .goods_list{
  display: block;
  margin:40px 0;
  padding:20px;
  background-color: #fff;
  border-radius: 10px;
}

#section04 .flex_box .goods_list dt{
  margin-bottom: 10px;
  font-size: 18px;
  color: #1c4b90;
}

#section04 .flex_box .goods_list ul li{
  text-indent: -16px;
  padding-left: 16px;
}

@media (max-width:1024px) {
  #section04{
    padding:405px 20px 200px;
    background-color: #fff2cc;
  }

  #section04 .open .img{
    position: absolute;
    top: -265px;
    left: 50%;
    width: 100%;
    max-width: 168px;
    transform: translate(-50%,0%);
    z-index: 2;
  }

  #section04 .open img{
    width: 168px;
    height: 168px;
  }
}
