﻿
html{
	font-size: 62.5%;
}

.main-area{
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: normal;
	overflow: hidden;
	box-sizing: border-box;
}

.main-area img {
	width: 100%;
	height: auto;
}

.visible-sp{
	display: block;
}

.visible-pc{
	display: none;
}

/********************common********************/
.main-area{
  margin-bottom: calc(190* (100vw /375));
}

.bg_box{
  width: 100%;
  height: calc(207* (100vw /375));
  position: absolute;
  top: calc(307* (100vw /375));
  z-index: -5;
  background-color: #F8F8F8;
}

.bg_box_2{
  top: calc(440* (100vw /375));
}

.bg_box_3{
  top: calc(314* (100vw /375));
}

.bg_box_4{
  top: calc(314* (100vw /375));
}

.text_box{
  font-size: calc(14* (100vw /375));
  letter-spacing: 0.08em;
  line-height: 2;
  color: #262626;
}

.sec_ttl{
  margin: 0 auto calc(54* (100vw /375));
  position: relative;
}

.bg_line{
  position: absolute;
  top: calc(25* (100vw /375));
  width: 100%;
  height: 1px;
  background-color: #262626;
  z-index: -5;
}

.item_box{
  margin: 0 auto;
  width: calc(278* (100vw /375));
  text-align: center;
}

.item_box img{
  margin-bottom: calc(14* (100vw /375));
}

.item_box p{
  text-decoration: underline;
}

.item_text{
  font-family: futura-pt, sans-serif;
}

.item_text h3{
  margin-bottom: calc(10* (100vw /375));
  font-size: calc(32* (100vw /375));
  letter-spacing: 0.07em;
}

.item_text p{
  font-size: calc(14* (100vw /375));
  letter-spacing: 0.05em;
}

.sec_box{
  margin: 0 auto calc(78* (100vw /375));
  width: calc(350* (100vw /375));
}

.sec_ttl_text_tax{
  position: relative;
}

.bg_line_2{
  position: absolute;
  top: calc(18* (100vw /375));
  width: 100%;
  height: 3px;
  background-color: #90C2CB;
  z-index: -10;
}

.bg_line_3{
  background-color: #A58E7A;
}

.sec_box_2{
  margin-bottom: 0;
}

.sec_box_3{
  margin: 0 auto calc(73* (100vw /375));
}

.sec_ttl_text_tax h3{
  margin: 0 0 calc(25* (100vw /375)) calc(17* (100vw /375));
  padding: 0 calc(10* (100vw /375)) 0 calc(10* (100vw /375));
  width: fit-content;
  background-color: #fff;
  font-size: calc(32* (100vw /375));
  letter-spacing: 0.07em;
  font-family: futura-pt, sans-serif;
}

.sec_ttl_text_tax p{
  margin-bottom: calc(44* (100vw /375));
  font-size: calc(14* (100vw /375));
  letter-spacing: 0.08em;
}

.sec_ttl_text_tax_3 p{
  margin-bottom: calc(39* (100vw /375));
}

.sec_ttl_text_tax ul li{
  margin-bottom: calc(12* (100vw /375));
  width: fit-content;
  height: auto;
  font-size: calc(12* (100vw /375));
  letter-spacing: 0.1em;
  line-height: 2;
  position: relative;
}

.buy_btn{
  position: absolute;
  top: 0;
  right: calc(-55* (100vw /375));
  padding: calc(6* (100vw /375)) calc(6* (100vw /375));
  font-size: calc(12* (100vw /375));
  letter-spacing: 0.1em;
  background-color: #262626;
  color: #FFFFFF;
  line-height: 1;
}

.buy_btn_2{
  position: absolute;
  top: calc(12* (100vw /375));
  right: calc(-55* (100vw /375));
  padding: calc(6* (100vw /375)) calc(7* (100vw /375));
  font-size: calc(12* (100vw /375));
  letter-spacing: 0.1em;
  background-color: #262626;
  color: #FFFFFF;
  line-height: 1; 
}

.li_margin{
  padding-bottom: calc(6* (100vw /375));
}

.sec_text_box{
  text-align: left;
}

.sec_ttl_text_tax_1 h3{
  color: #90C2CB;
}

.sec_ttl_text_tax_2 h3{
  color: #A58E7A;
}

.sec_ttl_text_tax_3 h3{
  color: #A58E7A;
}

/********************mv********************/
.mv{
  margin-bottom: calc(64* (100vw /375));
}

.mv_img{
  margin-bottom: calc(62* (100vw /375));
}

.mv_text_box{
  text-align: center;
}

/********************sec01********************/
.sec01{
  margin-bottom: calc(120* (100vw /375));
  position: relative;
}

.sec01_item_box_1{
  margin-bottom: calc(120* (100vw /375));
}

.sec01 h2{
  width: calc(204* (100vw /375));
}

.sec01_img_2{
  margin-bottom: calc(43* (100vw /375));
}

.sec01_img_3{
  margin-bottom: calc(43* (100vw /375));
}


/********************sec02********************/
.sec02{
  margin-bottom: calc(120* (100vw /375));
  position: relative;
}

.sec02_item_box_1{
  margin-bottom: calc(120* (100vw /375));
}

.sec02 h2{
  width: calc(207* (100vw /375));
}

.sec02_img_2{
  margin-bottom: calc(43* (100vw /375));
}


.sec02_img_3{
  margin-bottom: calc(43* (100vw /375));
}


/********************sec03********************/
.sec03{
  margin-bottom: calc(120* (100vw /375));
  position: relative;
}

.sec03_item_box_1{
  margin-bottom: calc(120* (100vw /375));
}

.sec03 h2{
  width: calc(210* (100vw /375));
}

.sec03_img_2{
  margin-bottom: calc(43* (100vw /375));
}

.sec03_img_3{
  margin-bottom: calc(43* (100vw /375));
}


/********************sec04********************/
.sec04{
  margin-bottom: calc(80* (100vw /375));
  position: relative;
}

.sec04_item_box_1{
  margin-bottom: calc(120* (100vw /375));
}

.sec04 h2{
  width: calc(216* (100vw /375));
}

.sec04_img_2{
  margin-bottom: calc(43* (100vw /375));
}

.sec04_img_3{
  margin-bottom: calc(43* (100vw /375));
}


/********************btn********************/
.sec_btn{
  margin: 0 auto;
  width: fit-content;
}

.sec_btn a:hover{
  opacity: 1;
}

#btn{
  width: calc(320* (100vw /375));
  height: calc(60* (100vw /375));
  background-color: #fff;
  color: #000;
  border: 1px #000 solid;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s;
}

#btn:hover{
  background-color: #000;
  color: #fff;
  opacity: 1;
}

.btn{
  text-align: center;
  font-size: calc(15* (100vw /375));
  letter-spacing: 0.05em;
  text-decoration: none;
  font-weight: 600;
}


/*************************************************
PC用デザイン
*************************************************/
@media screen and (min-width:767px) {

.sp{
  display: none;
}

.pc{
  display: block;
}

.main-area{
  margin-bottom: 18rem;
}

.visible-sp{
	display: none;
}

.visible-pc{
	display: block;
}


/********************common********************/
.bg_box{
  height: 21rem;
  top: 33.8rem;
}

.bg_line{
  top: 2.5rem;
}

.bg_box_2{
  top: 50.2rem;
}

.bg_box_3{
  height: 21rem;
  top: 34rem;
}

.bg_box_4{
  top: 34.7rem;
}

.text_box{
  font-size: 1.4rem;
}

.sec_ttl{
  margin: 0 auto 4.3rem
}

.bg_line_2{
  top: 2rem;
  height: clamp(1px, calc(3* (100vw / 1366)) ,3px);
}

.item_box{
  margin: 0 auto 4rem;
  width: 32.2rem;
}

.item_box img{
  margin-bottom: 1rem;
  width: 100%;
}

.item_text h3{
  margin-bottom: 0.9rem;
  font-size: 3.2rem;
}

.item_text p{
  font-size: 1.4rem;
  letter-spacing: 0.03em;
}

.sec_box{
  margin: 0 auto 0;
  width: 92rem;
  display: flex;
  justify-content: space-between;
}

.sec_box_2{
  flex-direction: row-reverse;
}

.sec_box_3{
  margin: 0 auto 0;
}

.sec_ttl_text_tax{
  margin-top: 10.4rem;
  width: 48rem;
}

.bg_line_3{
  top: 1.9rem;
}

.sec_ttl_text_tax h3{
  margin: 0 0rem 2.1rem 2.4rem;
  padding: 0 1rem 0 1.5rem;
  font-size: 3.6rem;
}

.sec_ttl_text_tax p{
  margin-bottom: 3.7rem;
  font-size: 1.4rem;
}

.sec_ttl_text_tax ul li{
  margin-bottom: 1.4rem;
  font-size: 1rem;
  line-height: 1;
}

.buy_btn{
  top: 0;
  right: 0;
  margin: auto 0 auto 0.4rem;
  padding: 0.3rem 0.5rem;
  font-size: 1rem;
  position: static
}

.buy_btn_2{
  top: 0;
  right: 0;
  margin: auto 0 auto 0.4rem;
  padding: 0.3rem 0.5rem;
  font-size: 1rem;
  position: static
}

.li_margin{
  margin-bottom: 1.4rem;
  padding: 0;
}


/********************mv********************/
.mv{
  margin: 0 auto 10rem;
  width: 120rem;
}

.mv_img{
  margin-bottom: 6.8rem;
}


/********************sec01********************/
.sec01{
  margin-bottom: 14.2rem;
}

.sec01_item_box_1{
  margin-bottom: 12rem;
}

.sec01 h2{
  width: 20.4rem;
}

.sec01_img_2{
  margin: 0;
  width: 40rem;
}

.sec01_img_3{
  margin: -6rem 0 0 0;
  width: 40rem;
}


/********************sec02********************/
.sec02{
  margin-bottom: 14.2rem;
}

.sec02_item_box_1{
  margin-bottom: 12rem;
}

.sec02 h2{
  width: 20.7rem;
}

.sec02_img_2{
  margin: 0;
  width: 40rem;
}

.sec02_img_3{
  margin: -6rem 0 0 0;
  width: 40rem;
}


/********************sec03********************/
.sec03{
  margin-bottom: 14.2rem;
}

.sec03_item_box_1{
  margin-bottom: 12rem;
}

.sec03 h2{
  width: 21rem;
}

.sec03_img_2{
  margin: 0;
  width: 40rem;
}

.sec03_img_3{
  margin: -6rem 0 0 0;
  width: 40rem;
}

.text_box_bottom p{
  margin-bottom: 3.3rem;
}

/********************sec04********************/
.sec04{
  margin-bottom: 14.2rem;
}

.sec04_item_box_1{
  margin-bottom: 11.9rem
}

.sec04_item_box_1 img{
  margin-bottom: 1.2rem;
}

.sec04 h2{
  width: 21.6rem;
}

.sec04_img_2{
  margin: 0;
  width: 40rem;
}

.sec04_img_3{
  margin: -6rem 0 0 0;
  width: 40rem;
}


/********************btn********************/
#btn {
  width: 36rem;
  height: 6rem;
}

.btn{
  font-size: 1.5rem;
}
}


/* パンくず 追加スタイル PC */
@media only screen and (min-width: 767px){
  .breadcrumb__list{
    padding-bottom: 1.6rem;
  }
}


/************************************************
タブレット用デザイン
*************************************************/
@media all and (min-width: 767px) and (max-width: 1400px) { 
  html{
    font-size: calc(10* 100vw /1400);
  }
}