@charset "UTF-8";

/* -------------------------
voice
------------------------- */

/*=== 共通 ===*/
.contents {
overflow: hidden;
font-feature-settings: "palt";
}

figure {
position: relative;
}

sup {
vertical-align: super;
font-size: 10px;
}
sup.small {
font-size: 8px;
}
.f-50 { font-size: 50%; }
.f-60 { font-size: 60%; }
.f-70 { font-size: 70%; }
.f-80 { font-size: 80%; }
.f-90 { font-size: 90%; }
.f-110 { font-size: 110%; }
.f-120 { font-size: 120%; }
.f-130 { font-size: 130%; }
.f-140 { font-size: 140%; }
.f-150 { font-size: 150%; }
.f-160 { font-size: 160%; }
.f-170 { font-size: 170%; }
.f-180 { font-size: 180%; }
.f-190 { font-size: 190%; }
.f-200 { font-size: 200%; }
.f-210 { font-size: 210%; }
.f-220 { font-size: 220%; }
.f-230 { font-size: 230%; }
.f-240 { font-size: 240%; }

.align_L { text-align: left; }
.align_C { text-align: center; }
.align_R { text-align: right; }

.f-palt {
font-feature-settings: "palt";
}

.contents {
overflow: hidden;
}
.contents figure {
position: relative;
height: fit-content;
line-height: 0;
}
.contents img {
width: 100%;
}

/*=== 共通 ===*/
#main_Wrap {
position: relative;
}

#main_Wrap h2 {
position: absolute;
top: 52%;
left: 50%;
transform: translateX(-50%);
font-size: clamp(20px, 3.333333333333333vw, 40px);
line-height: 1.3;
color: #fff;
text-shadow: 0px 0px 6px #000000, 0px 0px 9px #000000;
letter-spacing: 0.12em;
font-family: "Cinzel", serif;
text-align: center;
}
#main_Wrap h2 span {
display: block;
font-family: "游明朝 Medium", YuMincho Medium , "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
font-size: clamp(15px, 2.5vw, 30px);
}
#main_Wrap h2 span small {
font-size: 60%;
}


/* voice / 共通 */
.contents .Txt_note {
display: inline-block;
font-size: 10px !important;
letter-spacing: 0;
line-height: 1.3;
}
.contents .Txt_note.type02 {
font-size: 12px !important;
line-height: 1.5;
}
.contents .cap_Txt {
position: absolute;
font-size: 10px;
bottom: 10px;
}

.contents ul + .Txt_note {
padding-top: 1em;
}
.contents figure + .Txt_note {
padding-top: 1em;
}
.contents .Txt_note + figure {
padding-top: 1em;
}
.contents .Txt_note.pt0 {
padding-top: 0;
}

.Txt_block {
display: flex;
justify-content: space-between;
flex-direction: column;
}

.contents .cap_Txt {
position: absolute;
font-size: 10px;
bottom: 10px;
}
.contents .cap_W { color: #fff;}
.contents .cap_B { color: #000;}

.contents .cap_ShaW {
text-shadow: 2px 0 2px #fff, -2px 0 2px #fff, 0 2px 2px #fff, 0 -2px 2px #fff;
}
.contents .cap_ShaB {
text-shadow: 2px 0 2px #666, -2px 0 2px #666, 0 2px 2px #666, 0 -2px 2px #666;
}
.contents .cap_R {
right: 5px;
}
.contents .cap_R_b-10 {
right: 5px;
bottom: -10px;
}
.contents .cap_L {
left: 5px;
text-align: left;
}
.contents .cap_L_top {
left: 5px;
text-align: left;
bottom: auto;
top: 20px;
font-size: 13px;
}

.contents .cap_h {
right: calc(50% - -10px);
text-align: left;
}
.contents .cap_half {
right: calc(50% - -20px);
text-align: left;
}


.in-box {
max-width: 1000px;
width: 94%;
margin: 0 auto;
position: relative;
text-align: left;
box-sizing: border-box;
}
.in-box-1200 {
max-width: 1200px;
width: 94%;
margin: 0 auto;
position: relative;
text-align: left;
box-sizing: border-box;
}
.con_box {}
.con_box h4 {
font-size: clamp( 15px, calc( 9.666666666666668px + 0.6944444444444444vw ), 18px );
/* color: #a08b5d; */
letter-spacing: 0;
line-height: 1.3;
font-feature-settings: "palt";
padding-top: 10px;
}
.con_box h4.ls-1 {
letter-spacing: -1px;
}
.con_box h4 span {
font-size: 12px;
color: #000;
padding-left: 20px;
}
.con_box h4 span.font_small {
font-size: 12px;
padding-left: 0;
line-height: 1.0;
}
.con_box h4 span a {
color: #a08b5d;
}

.con_box h5 {
font-size: 18px;
}
.con_box h5.type_2 {
text-align: center;
font-size: 16px;
border: 1px solid #000;
margin-top: 10px;
}
.con_box h4 + h5 {
padding-top: 10px;
}

.con_box p {
/* font-size: 14px !important; */
font-size: clamp( 13px, calc( 11.222222222222221px + 0.23148148148148145vw ), 14px );
letter-spacing: 0.08em;
font-feature-settings: "palt";
line-height: 1.5;
}
.con_box h4 + p {
padding-top: 8px;
}
.con_box h4 + .Txt_note {
padding-top: 1em;
}
.con_box h5 + p {
padding-top: 8px;
}
.con_box p + p {
padding-top: 1em;
}
.con_box p + .Txt_note {
padding-top: 1em;
}
.con_box .Txt_note + p {
padding-top: 1em;
}
.con_box p + figure {
padding-top: 1em;
}
.con_box figure + figure {
padding-top: 1em;
}
.con_box div + figure {
padding-top: 1em;
}
.con_box h4 + figure {
padding-top: 1em;
}

.con_box p.align_R {
text-align: right;
}
.con_box .notes {
margin-top: 10px;
font-size: 10px !important;
padding: 0;
text-indent: 0;
}
.con_box .notes.pdd-T {
margin-top: 0 !important;
font-size: 10px !important;
padding-bottom: 0;
}
.con_box .notes.mh5 {
min-height: 5rem;
}

#notes_Area {
background: #fff;
}


.column_2 {
display: flex;
justify-content: space-between;
}
.column_2 li {
width: calc((100% - 6%) / 2);
    align-items: center;
}








/* voice　/　共通 */
[class^="sec_"] {
padding: 0 0 120px;
}
.ttl_Box {
padding: 6px 0;
position: relative;
margin-bottom: 60px;
}
.sec_01 .ttl_Box {
background: #936519;
background: linear-gradient(-90deg, rgba(147, 101, 25, 1) 0%, rgba(234, 201, 103, 1) 100%);
}
.sec_02 .ttl_Box {
background: #7A7A7A;
background: linear-gradient(90deg, rgba(207, 207, 207, 1) 0%, rgba(122, 122, 122, 1) 100%);
}
.sec_03 .ttl_Box {
background: #934719;
background: linear-gradient(90deg, rgba(234, 174, 103, 1) 0%, rgba(147, 71, 25, 1) 100%);
}
.sec_04 .ttl_Box,
.sec_05 .ttl_Box {
background: #1d3044;
}
.ttl_inner {
position: relative;
width: 94%;
max-width: 1200px;
margin: 0 auto;
}

.ttl_Box .icn_ttl {
position: absolute;
top: 50%;
left: 0;
transform: translate(0, -50%);
max-width: 154px;
width: 20%;
}
.ttl_Box h3 {
padding: 0.5em 0;
text-align: center;
color:#FFF;
font-size: clamp( 20px, calc( -19.111111111111107px + 5.092592592592593vw ), 42px );
font-family: "游明朝 Medium", YuMincho Medium , "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
letter-spacing: 0.08em;
}
.sec_05 .ttl_Box h3 {
letter-spacing: 0.04em;
}
.border-gradient {
border-top: 1px solid;
border-bottom: 1px solid;
border-image-source: linear-gradient(to right, transparent, #FFF 30%, #FFF 70%, transparent);
border-image-slice: 1;
}


.illust_Size img {
max-height: 163px;
width: 100%;
object-fit:contain;
}
.illust_Size02 img {
max-height: 220px;
width: 100%;
object-fit:contain;
}
.comment_Box {
max-width: 340px;
width:94%;
padding-left: 50px;
}
.comment_Box_Inner {
border-radius: 10px;
padding: 1em;
position: relative;
height: stretch;
}
.comment_Box h4{
font-size: clamp(18px, 2vw, 24px);
letter-spacing: 0;
line-height: 1.3;
padding-top: 0;
letter-spacing: 0.12em;
}


.sec_01 .comment_Box_Inner { border:2px solid #b89223; }
.sec_02 .comment_Box_Inner { border:2px solid #9d9d9d; }
.sec_03 .comment_Box_Inner { border:2px solid #b26b35; }
.sec_04 .comment_Box_Inner { border:2px solid #1d3044; }
.sec_05 .comment_Box_Inner { border:2px solid #1d3044; }

.comment_Box_Inner::before {
content: "";
height: 15px;
position: absolute;
width: 30px;
clip-path: polygon(100% 0, 0 50%, 100% 100%);
left: -30px;
top: 22%;
}
.sec_01 .comment_Box_Inner::before { background-color: #b89223; }
.sec_02 .comment_Box_Inner::before { background-color: #9d9d9d; }
.sec_03 .comment_Box_Inner::before { background-color: #b26b35; }
.sec_04 .comment_Box_Inner::before { background-color: #1d3044; }
.sec_05 .comment_Box_Inner::before { background-color: #1d3044; }

.sec_01 .comment_Box_Inner h4 { color:#b89223 }
.sec_02 .comment_Box_Inner h4 { color:#9d9d9d }
.sec_03 .comment_Box_Inner h4 { color:#b26b35 }
.sec_04 .comment_Box_Inner h4 { color:#1d3044 }
.sec_05 .comment_Box_Inner h4 { color:#1d3044 }

.ex_Box.flex {
margin-top: 60px;
gap: 30px 5%;
}
.ex_Box .txt h4 {
font-size: clamp( 18px, 2vw, 24px );
line-height: 1.6;
letter-spacing: 0.12em;
margin-bottom: 10px;
}
.ex_Box .txt p {
font-size: clamp( 14px, 1.33333333vw, 16px );
line-height: 1.8;
letter-spacing: 0.08em;
}
.ex_Box .txt p + figure {
margin-top: 1em;
}


/* voice　/　個別 */

/* lead_Area */
.lead_Area {
margin: 0 auto;
padding: 80px 0 100px;
background: url("../img/bg.jpg") center top no-repeat;
background-size: cover;
}
.lead_Area p {
text-align: center;
font-size: clamp( 14px, 1.33333333vw, 16px );
line-height: 2.0;
letter-spacing: 0.15em;
margin-bottom: 30px;
}
.lead_Area h3 {
max-width: 476px;
width:94%;
/* text-align: center;
font-size: 18px;
letter-spacing: 0.15em; */
margin: 0 auto 40px;
}
.lead_Area figure {
max-width: 945px;
width:94%;
margin: 0 auto;
}


/* sec_01 */
.sec_01 .ex_Box {
background: #fff9f3;
align-items: center;
}
.sec_01 .ex_Box .fig {
width:57.14285714%;
}
.sec_01 .ex_Box .txt {
display: flex;
align-items: center;
width:42.85714286%;
background: url("../img/sec01_bg.jpg") right top no-repeat;
background-size: cover;
padding: clamp(15px,2.14285714%,30px) 0 1em 0;
}
.sec_01 .ex_Box .txt > div{
width:80%;
max-width: calc(480px * 1.2);
}
.sec_01 .ex_Box .txt h4 {
color:#7d683d;
line-height: 1;
}
.sec_01 .ex_Box .txt figure{
margin-top: 1.875em;
}

/* sec_02 */
.sec_02 .ex_Box {
justify-content: space-between;
align-items: flex-end;
}
.sec_02 .ex_Box .fig_Wrap {
width:54.58333333%;
display: flex;
justify-content: flex-start;
gap: 20px 3.81679389%;
}
.sec_02 .ex_Box .fig {
max-width: 315px;
width:48.09160305%;
}
.sec_02 .ex_Box .txt {
width:39.66666667%;
}
.sec_02 .ex_Box .txt h4 {
    margin-bottom: 20px;
}

/* sec_03 */
.sec_03 .ex_Box {
justify-content: space-between;
align-items: flex-end;
}
.sec_03 .ex_Box .fig {
width:36.66666667%;
}
.sec_03 .ex_Box .txt {
width:58.33333%;
}
.sec_03 .ex_Box .txt figure {
margin-top: 30px;
}


/* sec_04 */
.sec_04 .ex_Box {
align-items: flex-start;
gap: 30px 2.5%;
}
.sec_04 .ex_Box .txt {
width:52.5%;
display: flex;
align-items: flex-start;
gap: 20px 6.66666667%;
}
.sec_04 .ex_Box .txt div{
width:52.85714286%;
}
.sec_04 .ex_Box .txt h4 {
color:#527082;
}
.sec_04 .ex_Box .txt p strong {
color:#527082;
font-size: 300%;
font-style: italic;
margin-right: 0.1em;
line-height: 1.0;
letter-spacing: 0;
}

.sec_04 .ex_Box .txt figure {
width:40.47619048%;
}
.sec_04 .ex_Box .txt > div figure {
width:100%;
}


.sec_04 .ex_Box .fig_Wrap {
width:45%;
display: flex;
gap: 20px 5.55555556%;
}
.sec_04 .ex_Box .fig_Wrap li {
width: 47.22222222%;
}
.sec_04 .ex_Box .fig_Wrap li p{
color: #385563;
font-size: clamp( 14px, 1.33333333vw, 16px );
padding-top: 0.75em;
text-align: center;
}

/* sec_05 */
.sec_05 {
padding: 0 0;
}
.sec_05 .ex_Box {
justify-content: space-between;
align-items: flex-start;
}
.sec_05 .ex_Box .txt {
display: flex;
flex-direction: column;
width:47.5%;
gap: 20px 0;
}

.sec_05 .ex_Box .txt figure {

}
.sec_05 .ex_Box .txt figure:nth-of-type(2) {
width: 66.49122807%;
margin: 0 auto;
}

.sec_05 .ex_Box .fig {
max-width: 570px;
width:48.5%;
}



/*=========================================================================================================
tab
=========================================================================================================*/
@media screen and (min-width: 768px) and (max-width: 1024px) {}

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

/*=== 共通 ===*/
#main_Wrap h2 {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
white-space: nowrap;
}

/* 設備仕様 / 共通 */
.contents .Txt_note {
padding-top: 5px;
padding-bottom: 0;
}
.con_box h4 {
font-size: 16px;
line-height: 1.4;
}

.con_box h4.font_s17 {
font-size: 16px;
}

.con_box h4.font_s14 {
font-size: 15.6px;
}

.con_box h4 span {
padding-left: 0px;
}

.con_box p {
letter-spacing: 0;
}

.con_box .ttl_borderbtm {
font-size: 16px;
padding-bottom: 8px;
letter-spacing: 0.09em;
line-height: 1.4;
font-feature-settings: "palt";
}

.column_2 {
flex-direction: column;
}
.column_2 li {
width: 100%;
align-items: center;
}
.column_2 li + li {
margin-top: 1em;
}


/* voice　/　共通 */
[class^="sec_"] {
padding: 0 0 60px;
}
.ttl_Box {
padding: 2px 0;
position: relative;
margin-bottom: 30px;
}
.ttl_Box .icn_ttl {
left: -2%;
width: 21%;
}
.ttl_Box h3 {
text-align: left;
padding: 1em 0 1em 22%;
}
.sec_05 .ttl_Box h3 {
line-height: 1.3;
padding: 0.5em 0 0.5em 22%;
}

.illust_Size,
.illust_Size02 {
width:30%;
margin: 0 auto;
}
.illust_Size img {
max-height: 120px;
width: 90%;
object-fit:contain;
}
.illust_Size02 img {
max-height: 120px;
width: 90%;
object-fit:contain;
}
.comment_Box {
max-width: 100%;
width:70%;
padding-left: 30px;
}

.comment_Box_Inner {
border-radius: 10px;
padding: 5px 10px 10px;
position: relative;
}

.ex_Box.flex {
flex-direction: column;
margin-top: 30px;
}


/* voice　/　個別 */

/* lead_Area */
.lead_Area {
padding: 30px 0;
}
.lead_Area p {
margin-bottom: 20px;
}
.lead_Area h3 {
max-width: 100%;
width:70%;
margin: 0 auto 20px;
}
.lead_Area figure {
max-width: 100%;
width:94%;
margin: 0 auto;
}

/* sec_01 */
.sec_01 .ex_Box {
    gap: 0 5%;
}
.sec_01 .ex_Box .fig {
max-width: 100%;
width:100%;
order:1;
}
.sec_01 .ex_Box .txt {
width:100%;
background: url("../img/sec01_bg.jpg") right top no-repeat;
background-size: cover;
padding:1.25em;
order:2;
}
.sec_01 .ex_Box .txt h4 {
color:#7d683d;
}
.sec_01 .ex_Box .txt > div {
    width: 100%;
}
.sec_01 .ex_Box .txt figure {
    margin-top: 1em;
}

/* sec_02 */
.sec_02 .ex_Box {
display: flex;
flex-wrap: wrap;
}
.sec_02 .ex_Box .fig_Wrap {
width:100%;
display: flex;
flex-wrap: wrap;
gap: 1em 3%;  
order:1;
}
.sec_02 .ex_Box .fig_Wrap h4 {
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1.6;
    letter-spacing: 0.12em;
}


.sec_02 .ex_Box .fig {
max-width: 315px;
width:48.5%;
}
.sec_02 .ex_Box .txt {
width:100%;
margin-left: 0%;
order:2;
}

/* sec_03 */
.sec_03 .ex_Box {
justify-content: space-between;
align-items: flex-end;
}
.sec_03 .ex_Box .fig {
max-width: 100%;
width:100%;
order:2;
}
.sec_03 .ex_Box .txt {
width:100%;
margin-left: 0%;
order:1;
}
.sec_03 .ex_Box .txt figure {
margin-top: 30px;
}

/* sec_04 */
.sec_04 .ex_Box {
align-items: flex-start;
gap: 20px 5%;
}
.sec_04 .ex_Box .txt {
width:100%;
flex-direction: column;
text-align: center;
}
.sec_04 .ex_Box .txt h4 {
    letter-spacing: 0.08em;
    
        text-align: left;
}
.sec_04 .ex_Box .txt div {
    width:100%;
}
.sec_04 .ex_Box .txt > div {

}
.sec_04 .ex_Box .txt p strong {
color:#527082;
font-size: 300%;
font-style: italic;
margin-right: 0.1em;
line-height: 1.0;
}

.sec_04 .ex_Box .txt figure {
width:100%;
}
.sec_04 .ex_Box .txt > div figure {
    width: 52.85714286%;
    margin: 0 auto;
}

.sec_04 .ex_Box .fig_Wrap {
width:100%;
}
.sec_04 .ex_Box .fig_Wrap li {
    width: 48%;
}

/* sec_05 */
.sec_05 {
padding: 0 0;
}
.sec_05 .ex_Box {
justify-content: space-between;
align-items: flex-start;
}
.sec_05 .ex_Box .txt {
width:100%;
}

.sec_05 .ex_Box .fig {
max-width: 100%;
width:100%;
}


}