@charset "utf-8";
/* CSS Document */



/*common*/
:root {
  --color00: #FFFFFF;
  --color01: #f4f5f1;
  --color02: #bb963c;
  --color03: #a78543;
  --color04: #63645c;
  --color99: #000000;

  --gd-g: linear-gradient(90deg, rgba(197, 176, 135, 1) 0%, rgba(190, 170, 129, 1) 7.47%, rgba(170, 153, 113, 1) 18.5%, rgba(137, 124, 86, 1) 31.67%, rgba(115, 105, 67, 1) 39.42%, rgba(132, 123, 85, 1) 41.76%, rgba(176, 170, 133, 1) 46.49%, rgba(247, 246, 209, 1) 53.11%, rgba(249, 248, 211, 1) 53.31%, rgba(234, 230, 192, 1) 55.15%, rgba(212, 204, 165, 1) 58.37%, rgba(194, 183, 143, 1) 62.06%, rgba(181, 167, 126, 1) 66.38%, rgba(171, 155, 115, 1) 71.72%, rgba(166, 149, 108, 1) 79.21%, rgba(164, 147, 106, 1) 100%);
  
}


html { font-size: 62.5%; scroll-behavior: smooth;}
a { text-decoration: none;}
body { font-family: "Noto Serif JP", serif; font-weight: 400;}

a,
a:hover { transition: ease .5s;}
a img { transform: scale(1); transition: ease .5s;}
a:hover img { transform: scale(1.2); transition: ease .5s; opacity: 0.8;}

.enL { font-family: "Montserrat", serif; font-weight: 300; letter-spacing: 0.05em;}
.enM { font-family: "Montserrat", serif; font-weight: 600; letter-spacing: 0.05em;}
.enB { font-family: "Montserrat", serif; font-weight: 900; letter-spacing: 0.05em;}
.jp-serif { font-family: "Noto Serif JP", serif;}


/*PC*/
@media print, screen and (min-width: 768px) {


/*----------------------------*/
body { font-size: min(1.19vw, 20px); background: var(--color00);}

.wrap { overflow-x: hidden;}

.pc { display: block;}
.sp { display: none;}
.pcBr { display: inline-block;}
.spBr { display: none;}

.spMenu { display: none;}


/*is-active*/
.slide { position: relative; overflow: hidden;}
.slide::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; background: var(--color01); transition: all 2s cubic-bezier(.645, .045, .355, 1);}
.slide.is-active::before { content: ""; position: absolute; top: 0; left: 100%; right: 0; bottom: 0; z-index: 10; background: var(--color01); transition: all 0.5s cubic-bezier(.645, .045, .355, 1);}


.btn_doc { position: fixed; top: min(5.952vw, 100px); right: 0; opacity: 0; visibility: hidden; transition: .3s;}
.btn_doc a { width: min(4.464vw, 75px); display: block; background: var(--color02); border-radius: min(1.19vw, 20px) 0 0 min(1.19vw, 20px);}
.btn_doc a:hover { background: var(--color03);}
.btn_doc a img { transform: scale(1.0); transition: ease .5s; opacity: 1.0;}
.btn_doc.show { opacity: 1; visibility: visible;}

.btn_top { position: fixed; bottom: 0; right: 30px; z-index: 500; mix-blend-mode: difference; color: #FFF;}
.btn_top a { width: min(4.464vw, 40px); display: block; font-size: 15px; writing-mode: vertical-rl; height: 150px; padding: 0 10px 10px; text-align: end; position: relative; cursor: pointer;}
.btn_top a::before { content: ""; position: absolute; top: -9px; left: -4px; width: 9px; height: 9px; background: var(--color00); border-radius: 50%; mix-blend-mode: difference;}
.btn_top a::after  { content: ""; position: absolute; top: 0; left: 0px; width: 1px; height: 150px; background: var(--color00); border-radius: 50%; mix-blend-mode: difference;}
.btn_top a:hover { padding: 0 10px 20px;}


/*----------------------------*/


/*kv*/
.kv { position: relative;}
.kv .move { width: 100%; height: 100vh; position: relative; overflow: hidden;}
.kv .move video { object-fit: cover; object-position: 50% 50%; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.kv .sc { position: absolute; left: 0; right: 0; bottom: 0; width: min(71.429vw, 1200px); margin: auto; display: flex; justify-content: flex-end;}
.kv .sc span { display: inline-block; writing-mode: vertical-rl; height: 115px; border-left: solid 1px var(--color99); margin-right: -30px;}



/*sec01*/
.sec01 { width: 100%; height: min(57.262vw, 962px); position: relative;}
.sec01::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; display: block; background: var(--color01);  transition: all 2s cubic-bezier(.645, .045, .355, 1);}
.sec01::after  { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -2; display: block; background: url("../images/sec01_bg.png") center no-repeat; background-size: cover;}
.sec01 nav { width: min(71.429vw, 1200px); height: min(6.548vw, 110px); margin: auto; display: flex; justify-content: space-between; white-space: nowrap;}
.sec01 nav ul { display: flex; justify-content: flex-start; align-items: center;}
.sec01 nav ul li {}
.sec01 nav ul li a { display: inline-block; padding: 0.5em 1em; margin-right: 1em;}
.sec01 nav ul li a::before { content: "-"; padding-right: 0.5em;}
.sec01 nav .btn { display: flex; align-items: flex-end;}
.sec01 nav .btn a { padding: 0.5em 1.5em; border: solid 1px var(--color99); margin-bottom: 20px;}
.sec01 .bg { width: 100%; height: min(50.714vw, 852px); position: relative;}
.sec01 .bg .img { width: min(58.929vw, 990px); position: absolute; right: 0; bottom: 0;}
.sec01 .box { width: min(71.429vw, 1200px); margin: auto;}
.sec01 .box h2 { width: min(52.738vw, 886px); position: absolute; top: min(10.119vw, 170px); margin-bottom: min(3.452vw, 58px); color: var(--color99);}
.sec01 .box h2 svg { width: 100%;}
.sec01 .box h2 svg symbol { width: 100%;}
.sec01 .box p { position: absolute; top: min(27.143vw, 456px); line-height: 2.0; letter-spacing: 0.1em;}

.sec01.is-black { }
.sec01.is-black::before { content: ""; background: none; transition: all 2s cubic-bezier(.645, .045, .355, 1);}
.sec01.is-black nav ul li a { color: var(--color00);}
.sec01.is-black nav .btn a { color: var(--color00); border-color: var(--color00);}
.sec01.is-black .box h2 { color: var(--color00);}
.sec01.is-black .box p { color: var(--color00);}



/*sec02*/
.sec02 { background: var(--color01);}
.sec02 .box { width: 100%; height: min(28.333vw, 476px); display: flex; justify-content: center; align-items: center; flex-direction: column;}
.sec02 .box h3 { width: min(49.881vw, 838px); margin-bottom: min(3.333vw, 56px);}
.sec02 .box p { text-align: center; line-height: 2.0; letter-spacing: 0.1em;}
.sec02 .box h3::before { transition-delay: 0.0s;}
.sec02 .box p::before { transition-delay: 0.5s;}



/*sec03*/
.sec03 { background: var(--color01);}
.sec03 .box { max-width: 1680px; height: min(75vw, 1260px); margin: auto; position: relative;}
.sec03 .box .img01 { width: min(29.048vw, 488px); position: absolute; top: min(0vw, 0px); left: min(0vw, 0px);}
.sec03 .box .img02 { width: min(34.048vw, 572px); position: absolute; top: min(3.929vw, 66px); right: min(0vw, 0px);}
.sec03 .box .img03 { width: min(34.048vw, 572px); position: absolute; top: min(43.571vw, 732px); left: min(41.369vw, 695px);}
.sec03 .box .txt01 { width: min(17.143vw, 288px); position: absolute; top: min(1.071vw, 18px); left: min(32.976vw, 554px);}
.sec03 .box .txt02 { width: min(17.143vw, 288px); position: absolute; top: min(13.69vw, 230px); right: min(35.06vw, 589px);}
.sec03 .box .txt03 { width: min(16.667vw, 280px); position: absolute; top: min(32.381vw, 544px); left: min(41.369vw, 695px);}

.sec03 .box .img01.slide.is-active::before { content: ""; transition-delay: 0.5s;}
.sec03 .box .img02.slide.is-active::before { content: ""; transition-delay: 1.0s;}
.sec03 .box .img03.slide.is-active::before { content: ""; transition-delay: 1.5s;}
.sec03 .box .txt01.slide.is-active::before { content: ""; transition-delay: 0.3s;}
.sec03 .box .txt02.slide.is-active::before { content: ""; transition-delay: 0.8s;}
.sec03 .box .txt03.slide.is-active::before { content: ""; transition-delay: 1.3s;}



/*sec04*/
.sec04 { background: var(--color00); padding: 0 0 min(9.524vw, 160px); max-width: 1680px; margin: auto; position: relative;}
.sec04::before { content: ""; position: absolute; top: min(0, 0); left: min(-5.952vw, -100px); background: url("../images/sec04_box_bg.png"); background-size: cover; width: min(46.31vw, 778px); height: min(20.417vw, 343px); opacity: 0.3;}
.sec04 .box { position: relative;}
.sec04 .box::before { content: ""; position: absolute; top: min(2.976vw, 50px); right: min(2.976vw, 50px); background: var(--gd-g); width: min(42.857vw, 720px); height: 2px;}
.sec04 .box::after  { content: ""; position: absolute; top: min(2.976vw, 50px); right: min(2.976vw, 50px); background: var(--gd-g); width: 2px; height: min(57.738vw, 970px);}
.sec04 .box h3 { font-size: min(4.464vw, 75px); margin: 0 0 min(3.274vw, 55px); padding: min(11.905vw, 200px) 0 0 min(11.19vw, 188px);}
.sec04 .box h4 { width: min(49.881vw, 838px); padding: 0 0 min(1.19vw, 20px) min(11.19vw, 188px);}
.sec04 .box p { line-height: 2.0; letter-spacing: 0.2em; margin-bottom: min(5.952vw, 100px); padding: 0 0 0 min(44.524vw, 748px);}
.sec04 .box .img { width: min(71.429vw, 1200px); margin: 0 auto min(4.167vw, 70px);}
.sec04 .box h5 { font-family: "Noto Sans JP", serif; font-size: min(1.19vw, 20px); font-weight: 700; letter-spacing: 0.1em; margin-bottom: min(2.679vw, 45px); text-align: center;}
.sec04 .box ul { display: flex; justify-content: center;}
.sec04 .box ul li {}
.sec04 .box ul li figure {}
.sec04 .box ul li figure img { margin-bottom: 15px;}
.sec04 .box ul li figure figcaption { font-family: "Noto Sans JP", serif; text-align: center;}



/*sec05*/
.sec05 { background: var(--color00); padding: 0 0 min(5.952vw, 100px); max-width: 1680px; margin: auto; position: relative;}
.sec05::before { content: ""; position: absolute; top: min(3.929vw, 66px); right: min(-6.667vw, -112px); background: url("../images/sec05_box_bg.png"); background-size: cover; width: min(30.655vw, 515px); height: min(18.452vw, 310px); opacity: 0.5;}
.sec05 .box { position: relative;}
.sec05 .box::before { content: ""; position: absolute; top: min(0.595vw, 10px); left: min(2.976vw, 50px); background: var(--gd-g); width: min(42.857vw, 720px); height: 2px;}
.sec05 .box::after  { content: ""; position: absolute; top: min(0.595vw, 10px); left: min(2.976vw, 50px); background: var(--gd-g); width: 2px; height: min(54.762vw, 920px);}
.sec05 .box h3 { font-size: min(4.464vw, 75px); margin: 0 0 min(3.274vw, 55px) min(50vw, 840px);}
.sec05 .box h4 { width: min(23.155vw, 389px); margin: 0 0 min(1.19vw, 20px) min(50vw, 840px);}
.sec05 .box p { line-height: 2.0; letter-spacing: 0.2em; margin: 0 0 min(6.25vw, 105px) min(14.286vw, 240px);}
.sec05 .box .img { width: min(71.429vw, 1200px); margin: 0 auto;}



/*sec06*/
.sec06 { background: var(--color00); padding: 0 0 min(10.476vw, 176px); max-width: 1680px; margin: auto; position: relative;}
.sec06::before { content: ""; position: absolute; top: min(1.667vw, 28px); left: min(-4.286vw, -72px); background: url("../images/sec06_box_bg.png"); background-size: cover; width: min(27.679vw, 465px); height: min(12.202vw, 205px); opacity: 0.5;}
.sec06 .box { position: relative;}
.sec06 .box::before { content: ""; position: absolute; top: min(2.976vw, 50px); right: min(2.976vw, 50px); background: var(--gd-g); width: min(42.857vw, 720px); height: 2px;}
.sec06 .box::after  { content: ""; position: absolute; top: min(2.976vw, 50px); right: min(2.976vw, 50px); background: var(--gd-g); width: 2px; height: min(57.738vw, 970px);}
.sec06 .box h3 { font-size: min(4.464vw, 75px); margin: 0 0 min(3.274vw, 55px) min(11.31vw, 190px); padding: min(12.202vw, 205px) 0 0;}
.sec06 .box h4 { width: min(62.857vw, 1056px); margin: 0 0 min(2.5vw, 42px) min(11.31vw, 190px);}
.sec06 .box p { line-height: 2.0; letter-spacing: 0.2em; margin: 0 0 min(6.548vw, 110px) min(48.214vw, 810px)}
.sec06 .box .img01 { width: min(53.631vw, 901px); margin: 0 auto min(5.476vw, 92px);}
.sec06 .box .img02 { width: min(33.69vw, 566px); margin: 0 auto;}



/*sec07*/
.sec07 { background: var(--color04); padding: 0 0 min(7.857vw, 132px);}
.sec07 .box { position: relative; width: min(71.429vw, 1200px); margin: auto; padding: min(9.226vw, 155px) 0 0;}
.sec07 .box::before { content: ""; position: absolute; top: min(-2.381vw, -40px); left: min(-4.762vw, -80px); width: min(17.857vw, 300px); height: min(4.762vw, 80px); background: url("../images/sec07_box_txt01.svg");}
.sec07 .box h3 { position: absolute; top: min(-1.19vw, -20px); left: 0; right: 0; margin: auto; width: min(26.548vw, 446px); height: min(4.762vw, 80px); display: flex; justify-content: center; align-items: center; background: var(--color00);}
.sec07 .box h3 img { width: min(17.857vw, 300px); height: min(2.381vw, 40px);}
.sec07 .box h4 { width: min(27.679vw, 465px); margin: 0 0 min(2.857vw, 48px);}
.sec07 .box p { line-height: 2.0; letter-spacing: 0.2em; color: var(--color00);}
.sec07 .box .img { width: min(34.762vw, 584px); position: absolute; bottom: min(-0.595vw, -10px); right: min(-4.167vw, -70px);}



/*footer*/
footer { display: flex; justify-content: center; align-items: center; height: 300px;}
footer .img { width: 210px;}
footer .img a:hover img { transform: scale(1.0); opacity: 1.0;}




}





/*sp*/
@media only screen and (max-width: 767px) {

/*基準値 横幅375px;*/

/*----------------------------*/
body { font-size: 3.733vw; line-height: 2.4;}

.wrap { overflow-x: hidden;}

.pc { display: none;}
.sp { display: block;}
.pcBr { display: none;}
.spBr { display: inline-block;}

.hamburger { position: fixed; top: 4.8vw; right: 5.333vw; width: 12.267vw; height: 12.267vw; border-radius: 50%; background: var(--color99); z-index: 1100;}
.hamburger a { width: 12.267vw; height: 100%; display: block; position: relative; cursor: pointer;}
.hamburger a span { width: 40%; height: 0.533vw; background: var(--color00); position: absolute; left: 0; right: 0; margin: auto; transition: 0.3s ease-in-out;}
.hamburger a span:nth-of-type(1) { top: 4.533vw; bottom: auto;}
.hamburger a span:nth-of-type(2) { top:auto; bottom: 4.533vw;}


.hamburger.active { background: var(--color00);}
.hamburger.active a span { background: var(--color99);}
.hamburger.active a span:nth-of-type(1) { transform: rotate(-45deg); top: 5.867vw; bottom: auto; transition: 0.3s ease-in-out;}
.hamburger.active a span:nth-of-type(2) { transform: rotate( 45deg); top: auto; bottom: 5.867vw; transition: 0.3s ease-in-out;}


.spMenu { z-index: 1000;}
.spMenu { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: var(--color99); opacity: 0; transform: translateY(-100%); transition: all 0.6s;}
.spMenu.active { display: block; opacity: 1.0; transform: translateY(0%); transition: all 0.6s;}
.spMenu .inner { display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; padding: 8vw 0; font-size: 4.267vw; overflow-y: auto;}
.spMenu a { color: var(--color00);}

.spMenu ul { margin-bottom: 16vw;}
.spMenu ul li { margin-bottom: 10.667vw;}
.spMenu ul li:nth-last-child(1) { margin-bottom: 0;}
.spMenu ul li a { display: block;}
.spMenu ul li a {}
.spMenu ul li a::before { content: "-"; padding-right: 0.5em;}
.spMenu .btn { margin-bottom: 10.667vw;}
.spMenu .btn a { display: flex; width: 58.667vw; height: 10.667vw; justify-content: center; align-items: center; border: solid 2px var(--color00);}
.spMenu .btn_doc2 {}
.spMenu .btn_doc2 a { display: flex; width: 58.667vw; height: 10.667vw; justify-content: center; align-items: center; background: var(--color03);}

.fixed { position: fixed; z-index: 100;}

/*----------------------------*/


/*is-active*/
.slide { position: relative; overflow: hidden;}
.slide::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 10; background: var(--color01); transition: all 2s cubic-bezier(.645, .045, .355, 1);}
.slide.is-active::before { content: ""; position: absolute; top: 0; left: 100%; right: 0; bottom: 0; z-index: 10; background: var(--color01); transition: all 0.5s cubic-bezier(.645, .045, .355, 1);}


/*kv*/
.kv { position: relative;}
.kv .move { width: 100%; height: 100vh; position: relative; overflow: hidden;}
.kv .move video { object-fit: cover; object-position: 50% 50%; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.kv .sc { position: absolute; left: 8vw; bottom: 0; width: auto; margin: auto;}
.kv .sc span { display: inline-block; writing-mode: vertical-rl; height: 30.667vw; border-left: solid 1px var(--color99); margin-right: -8vw;}


.btn_doc { display: none; position: fixed; top: min(5.952vw, 100px); right: 0; opacity: 0; visibility: hidden; transition: .3s; z-index: 50;}
.btn_doc a { width: min(4.464vw, 75px); display: block; background: var(--color02); border-radius: min(1.19vw, 20px) 0 0 min(1.19vw, 20px);}
.btn_doc a:hover { background: var(--color03);}
.btn_doc a img { transform: scale(1.0); transition: ease .5s; opacity: 1.0;}
.btn_doc.show { opacity: 1; visibility: visible;}

.btn_top { position: fixed; bottom: 0; right: 8vw; z-index: 500; mix-blend-mode: difference; color: #FFF;}
.btn_top a { width: 9.333vw; display: block; font-size: 4vw; writing-mode: vertical-rl; height: 40vw; padding: 0 0 2.667vw 1.333vw; text-align: end; position: relative; cursor: pointer;}
.btn_top a::before { content: ""; position: absolute; top: -2.4vw; left: -1.2vw; width: 2.4vw; height: 2.4vw; background: var(--color00); border-radius: 50%; mix-blend-mode: difference;}
.btn_top a::after  { content: ""; position: absolute; top: 0; left: 0px; width: 1px; height: 40vw; background: var(--color00); border-radius: 50%; mix-blend-mode: difference;}
.btn_top a:hover { padding: 0 0 5.333vw 1.333vw;}



/*sec01*/
.sec01 { width: 100%; height: 194.667vw; position: relative; margin-top: -0.8vw;}
.sec01::before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -1; display: block; background: var(--color01);  transition: all 2s cubic-bezier(.645, .045, .355, 1);}
.sec01::after  { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: -2; display: block; background: url("../images/sec01_bg_sp.png") center no-repeat; background-size: cover;}
.sec01 .bg { width: 100%; height: 100%; position: relative;}
.sec01 .bg .img { width: 100%; position: absolute; bottom: 0; left: 0;}
.sec01 .box { width: min(71.429vw, 1200px); margin: auto;}
.sec01 .box h2 { width: 72.8vw; position: absolute; top: 13.333vw; left: 7.2vw; fill: var(--color99);}
.sec01 .box h2 svg { width: 100%;}
.sec01 .box h2 svg symbol { width: 100%;}
.sec01 .box p { position: absolute; top: 72vw; left: 7.2vw; line-height: 2.0; letter-spacing: 0.2em;}

.sec01.is-black { }
.sec01.is-black::before { content: ""; background: none; transition: all 2s cubic-bezier(.645, .045, .355, 1);}
.sec01.is-black nav ul li a { color: var(--color00);}
.sec01.is-black nav .btn a { color: var(--color00); border-color: var(--color00);}
.sec01.is-black .box h2 { fill: var(--color00);}
.sec01.is-black .box p { color: var(--color00);}




/*sec02*/
.sec02 { background: var(--color01); padding: 12vw 0 9.333vw;}
.sec02 .box { width: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column;}
.sec02 .box h3 { width: 64vw; margin-bottom: 8vw;}
.sec02 .box p { text-align: center; line-height: 2.0; letter-spacing: 0.2em;}
.sec02 .box h3::before { transition-delay: 0.0s;}
.sec02 .box p::before { transition-delay: 0.5s;}



/*sec03*/
.sec03 { background: var(--color01);}
.sec03 .box { max-width: 100%; margin: auto; position: relative;}
.sec03 .box .img01 { width: 65.067vw; margin: 0 auto 0 0;}
.sec03 .box .img02 { width: 76.267vw; margin: 0 0 0 auto;}
.sec03 .box .img03 { width: 76.267vw; margin: 0 auto;}
.sec03 .box .txt01 { width: 38.4vw; margin: auto; padding: 8vw 0;}
.sec03 .box .txt02 { width: 38.4vw; margin: auto; padding: 8vw 0;}
.sec03 .box .txt03 { width: 37.333vw; margin: auto; padding: 8vw 0;}

.sec03 .box .img01.slide.is-active::before { content: ""; transition-delay: 0.5s;}
.sec03 .box .img02.slide.is-active::before { content: ""; transition-delay: 1.0s;}
.sec03 .box .img03.slide.is-active::before { content: ""; transition-delay: 1.5s;}
.sec03 .box .txt01.slide.is-active::before { content: ""; transition-delay: 0.3s;}
.sec03 .box .txt02.slide.is-active::before { content: ""; transition-delay: 0.8s;}
.sec03 .box .txt03.slide.is-active::before { content: ""; transition-delay: 1.3s;}



/*sec04*/
.sec04 { background: var(--color00); padding: 0; max-width: 448vw; margin: auto; position: relative;}
.sec04::before { content: ""; position: absolute; top: 8vw; left: -8vw; background: url("../images/sec04_box_bg.png"); background-size: cover; width: 87.2vw; height: 38.4vw; opacity: 0.3;}
.sec04::after  { content: ""; position: absolute; top: 27.733vw; right: 7.2vw; background: url("../images/sec04_box_num_sp.svg"); background-size: cover; width: 18.667vw; height: 13.867vw;}
.sec04 .box { position: relative; padding: 0 0 0 7.2vw;}
.sec04 .box::before { content: ""; position: absolute; top: 22.933vw; right: 2.667vw; background: var(--gd-g); width: 90.133vw; height: 0.533vw;}
.sec04 .box::after  { content: ""; position: absolute; top: 22.933vw; right: 2.667vw; background: var(--gd-g); width: 0.533vw; height: 213.333vw;}
.sec04 .box h3 { font-size: 6.933vw; margin: 0; padding: 48vw 0 4.8vw;}
.sec04 .box h4 { width: 68.8vw; padding: 0 0 8vw;}
.sec04 .box p { line-height: 2.0; letter-spacing: 0.1em; margin-bottom: 9.333vw;}
.sec04 .box .img { width: 85.333vw; padding: 0 0 28.533vw;}



/*sec05*/
.sec05 { background: var(--color00); padding: 0; max-width: 448vw; margin: auto; position: relative;}
.sec05::before { content: ""; position: absolute; top: 0; right: -20.533vw; background: url("../images/sec05_box_bg.png"); background-size: cover; width: 57.6vw; height: 34.667vw; opacity: 0.5;}
.sec05::after  { content: ""; position: absolute; top: 8vw; left: 7.2vw; background: url("../images/sec05_box_num_sp.svg"); background-size: cover; width: 20.533vw; height: 13.867vw;}
.sec05 .box { position: relative; padding: 0 0 0 0;}
.sec05 .box::before { content: ""; position: absolute; top: 3.733vw; left: 2.667vw; background: var(--gd-g); width: 24vw; height: 0.533vw;}
.sec05 .box::after  { content: ""; position: absolute; top: 3.733vw; left: 2.667vw; background: var(--gd-g); width: 0.533vw; height: 220vw;}
.sec05 .box h3 { font-size: 6.933vw; margin: 0 3.733vw 4.8vw 0; text-align: right;}
.sec05 .box h4 { width: 25.867vw; margin: 0 0 8vw 32.8vw;}
.sec05 .box p { line-height: 2.0; letter-spacing: 0.1em; margin: 0 0 8.533vw 7.2vw;}
.sec05 .box .img { width: 85.6vw; margin: 0 auto 0 7.2vw; padding: 0 0 24vw;}



/*sec06*/
.sec06 { background: var(--color00); padding: 0 0 min(10.476vw, 176px); max-width: 448vw; margin: auto; position: relative;}
.sec06::before { content: ""; position: absolute; top: 0; left: -25.867vw; background: url("../images/sec06_box_bg.png"); background-size: cover; width: 81.867vw; height: 36vw; opacity: 0.5;}
.sec06::after  { content: ""; position: absolute; top: 22.667vw; right: 6.4vw; background: url("../images/sec06_box_num_sp.svg"); background-size: cover; width: 19.467vw; height: 13.6vw;}
.sec06 .box { position: relative; padding: 0;}
.sec06 .box::before { content: ""; position: absolute; top: 4vw; right: 2.667vw; background: var(--gd-g); width: 90.133vw; height: 0.533vw;}
.sec06 .box::after  { content: ""; position: absolute; top: 4vw; right: 2.667vw; background: var(--gd-g); width: 0.533vw; height: 202.667vw;}
.sec06 .box h3 { font-size: 6.933vw; margin: 0 3.733vw 4.8vw 0; padding: 29.333vw 0 0 7.2vw;}
.sec06 .box h4 { width: 77.867vw; margin: 0 0 8.533vw 7.2vw;}
.sec06 .box p { line-height: 2.0; letter-spacing: 0.2em; margin: 0 0 15.467vw 7.2vw;}
.sec06 .box .img01 { width: 92.533vw; margin: 0 0 12vw;}
.sec06 .box .img02 { width: 82.933vw; margin: 0 auto 60px;}



/*sec07*/
.sec07 { background: var(--color04); padding: 0 0 13.333vw;}
.sec07 .box { position: relative; width: auto; margin: auto; padding: 36vw 8vw 0;}
.sec07 .box::before { content: ""; position: absolute; top: 9.067vw; left: -0.8vw; width: 55.467vw; height: 14.933vw; background: url("../images/sec07_box_txt01.svg") no-repeat;}
.sec07 .box h3 { position: absolute; top: 0; left: 0; right: 0; margin: auto; width: 65.333vw; height: 9.067vw; display: flex; justify-content: center; align-items: center; background: var(--color00);}
.sec07 .box h3 img { width: 41.6vw; height: 5.6vw;}
.sec07 .box h4 { width: 68vw; margin: 0 0 7.2vw;}
.sec07 .box p { line-height: 2.0; letter-spacing: 0.2em; color: var(--color00);}
.sec07 .box .img { width: 100%; margin: 33px auto 0;}



/*footer*/
footer { display: flex; justify-content: center; align-items: center; height: 42.667vw; background: var(--color00);}
footer .img { width: 28vw; margin: 0 0 13.333vw;}
footer .img a:hover img { transform: scale(1.0); opacity: 1.0;}

}