@charset "UTF-8"; * { min-height: 0vw; } html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video, input, button, textarea, select, option, text { margin: 0; padding: 0; border: 0; outline: none; color: inherit; font: inherit; text-decoration: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, main, footer, header, hgroup, menu, nav, section, form { display: block; } html, body { position: absolute; width: 100%; height: 100%; -webkit-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -ms-text-size-adjust: 100%; text-size-adjust: 100%; } html { scroll-behavior: smooth; } @media screen and (min-width: 769px) { html { scroll-padding-top: 120px; } } @media screen and (max-width: 768px) { html { scroll-padding-top: 92px; } } body { background-color: #fff; color: #394340; font-family: "Noto Sans JP", sans-serif; font-weight: 500; line-height: 1; word-wrap: break-word; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overflow-wrap: break-word; scroll-behavior: smooth; } ol, ul, li { display: block; list-style: none; } blockquote, q { quotes: none; } blockquote:before, q:before, blockquote:after, q:after { content: ""; content: none; } strong, b { font-weight: bold; } em { font-style: italic; } table { border-spacing: 0; border-collapse: collapse; } input, button, textarea, select, option { border-radius: 0; background-color: rgba(255, 255, 255, 0); color: inherit; font: inherit; text-align: inherit; letter-spacing: inherit; -webkit-appearance: none; -moz-appearance: none; appearance: none; } input::-webkit-input-placeholder, button::-webkit-input-placeholder, textarea::-webkit-input-placeholder, select::-webkit-input-placeholder, option::-webkit-input-placeholder { color: rgba(14, 14, 15, 0.4); } input:-moz-placeholder, button:-moz-placeholder, textarea:-moz-placeholder, select:-moz-placeholder, option:-moz-placeholder { color: rgba(14, 14, 15, 0.4); } input:-ms-input-placeholder, button:-ms-input-placeholder, textarea:-ms-input-placeholder, select:-ms-input-placeholder, option:-ms-input-placeholder { color: rgba(14, 14, 15, 0.4); } input::placeholder, button::placeholder, textarea::placeholder, select::placeholder, option::placeholder { color: rgba(14, 14, 15, 0.4); } img, svg { display: block; height: auto; vertical-align: bottom; } img:not(.setWidth), svg:not(.setWidth) { width: 100%; } img.setWidth, svg.setWidth { width: auto; } a { display: block; } a:not(.noHover):hover { opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); } iframe { vertical-align: bottom; } a, button, input[type="button"], input[type="submit"], input[type="file"], label.hoverAction { cursor: pointer; } * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0; padding: 0; border: 0; font: inherit; text-decoration: inherit; vertical-align: baseline; } @media screen and (min-width: 769px) { .util_sp { display: none !important; } } @media screen and (max-width: 768px) { .util_pc { display: none !important; } } @media screen and (min-width: 375px) { .util_max374 { display: none !important; } } @media screen and (max-width: 374px) { .util_min375 { display: none !important; } } .indent_line { margin-left: -0.6em; } .komeji { display: inline-block; font-size: 0.5rem; -webkit-transform: translateY(-30%); -moz-transform: translateY(-30%); -ms-transform: translateY(-30%); -o-transform: translateY(-30%); transform: translateY(-30%); } .nav_it_lk { font-weight: bold; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .gr_txt { color: #4c9170; } .bl_txt { color: #007aa9; } .or_txt { color: #ea5504; } .align_center { text-align: center; } @media screen and (max-width: 768px) { main { overflow: hidden; } } #header { position: fixed; z-index: 150; top: 0; left: 0; width: 100vw; background-color: #fff; -webkit-transition: background-color 0.3s; -moz-transition: background-color 0.3s; -ms-transition: background-color 0.3s; -o-transition: background-color 0.3s; transition: background-color 0.3s; } #header_lg { height: 100%; } #header_lg_lk { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: 100%; height: 100%; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } @media screen and (min-width: 769px) { #header_nav_checkbox, #header_checkbox_label, #header_sns_list { display: none; } #header_inner { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; height: clamp(0px, 5.490483162518302vw, 75px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-align: start; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } #header_lg { padding: clamp(0px, 1.464128843338214vw, 20px) clamp(0px, 2.928257686676428vw, 40px); } #header_lg_lk { width: clamp(0px, 28.65519765739385vw, 391.43px); } #header_nav { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; height: 100%; padding: 0 clamp(0px, 2.928257686676428vw, 40px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #header_nav_list, #header_contact_nav_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #header_nav_list .nav_it:not(:first-child) { margin-left: clamp(0px, 1.756954612005857vw, 24px); } #header_nav_list .nav_it_lk { font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.02489019033675vw, 14px); } #header_nav_list .nav_it_lk:hover { color: #4c9170; } } @media screen and (max-width: 768px) { #header_inner { height: clamp(0px, 19.2vw, 72px); } #header_lg { width: fit-content; padding: clamp(0px, 4vw, 15px) clamp(0px, 5.333333333333334vw, 20px); } #header_lg_lk { width: clamp(0px, 62.66666666666667vw, 235px); } #header_nav { display: none; } #header_nav_checkbox, #header_nav_checkbox_label { display: block; position: absolute; z-index: 150; top: clamp(0px, 7.466666666666668vw, 28px); right: clamp(0px, 5.333333333333334vw, 20px); width: clamp(0px, 6.4vw, 24px); height: clamp(0px, 4.266666666666667vw, 16px); cursor: pointer; } #header_nav_checkbox_label .header_nav_checkbox_label_bar { position: absolute; left: 50%; width: 100%; height: clamp(0px, 0.8vw, 3px); background-color: #4c9170; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #header_nav_checkbox_label .header_nav_checkbox_label_bar:nth-child(1) { top: 0; } #header_nav_checkbox_label .header_nav_checkbox_label_bar:nth-child(2) { top: 50%; } #header_nav_checkbox_label .header_nav_checkbox_label_bar:nth-child(3) { top: 100%; } #header_nav_checkbox:checked, #header_nav_checkbox:checked + #header_nav_checkbox:checked_nav_checkbox_label { top: clamp(0px, 5.2vw, 19.5px); right: clamp(0px, 6.266666666666667vw, 23.5px); } #header_nav_checkbox:checked + #header_nav_checkbox_label .header_nav_checkbox_label_bar:nth-child(1) { top: 0; -webkit-transform: translate(-50%, -50%) rotate(45deg); -moz-transform: translate(-50%, -50%) rotate(45deg); -ms-transform: translate(-50%, -50%) rotate(45deg); -o-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); } #header_nav_checkbox:checked + #header_nav_checkbox_label .header_nav_checkbox_label_bar:nth-child(2) { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } #header_nav_checkbox:checked + #header_nav_checkbox_label .header_nav_checkbox_label_bar:nth-child(3) { top: 0; -webkit-transform: translate(-50%, -50%) rotate(-45deg); -moz-transform: translate(-50%, -50%) rotate(-45deg); -ms-transform: translate(-50%, -50%) rotate(-45deg); -o-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner { overflow-y: scroll; position: fixed; z-index: 100; width: 100%; height: 100vh; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_nav { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; flex-direction: column; min-height: fit-content; height: 100%; -webkit-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_lg { position: absolute; top: clamp(0px, 4vw, 15px); left: clamp(0px, 5.333333333333334vw, 20px); width: fit-content; height: fit-content; padding: 0; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_lg_lk { width: clamp(0px, 62.66666666666667vw, 235px); height: clamp(0px, 11.200000000000001vw, 42px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_nav { height: fit-content; padding: clamp(0px, 30.666666666666664vw, 115px) clamp(0px, 8vw, 30px) clamp(0px, 20.533333333333335vw, 77px); border-bottom-right-radius: clamp(0px, 3.2vw, 12px); border-bottom-left-radius: clamp(0px, 3.2vw, 12px); background-color: #fff; -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_nav_list { text-align: center; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_nav_list .nav_it:not(:first-child) { margin-top: clamp(0px, 10.4vw, 39px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_nav_list .nav_it_lk { font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 7.466666666666668vw, 28px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_contact_nav_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 10.666666666666668vw, 40px); -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_contact_nav_list .nav_it { width: 46.7%; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_contact_nav_list .nav_it_lk { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: 100%; height: clamp(0px, 17.066666666666666vw, 64px); border-radius: clamp(0px, 4.266666666666667vw, 16px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 4vw, 15px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_contact_nav_list .nav_it:not(:first-child) { margin-left: clamp(0px, 4.266666666666667vw, 16px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_sns_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 10.666666666666668vw, 40px); padding-bottom: clamp(0px, 10.666666666666668vw, 40px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_sns_list .sns_it:not(:first-child) { margin-left: clamp(0px, 8.533333333333333vw, 32px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_sns_list .sns_it_lk.facebook { width: clamp(0px, 3.466666666666666vw, 13px); height: clamp(0px, 6.4vw, 24px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_sns_list .sns_it_lk.inst { width: clamp(0px, 6.4vw, 24px); height: clamp(0px, 6.4vw, 24px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_sns_list .sns_it_lk.mail { width: clamp(0px, 6.565333333333334vw, 24.62px); height: clamp(0px, 4.8vw, 18px); } #header_nav_checkbox:checked + #header_nav_checkbox_label ~ #header_inner #header_slogan { width: clamp(0px, 64vw, 240px); height: clamp(0px, 51.51466666666666vw, 193.18px); margin: auto auto 0; } } #entry_lk { display: block; display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; position: fixed; z-index: 3; border-style: solid; border-color: #fff; background: -webkit-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: -moz-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: -o-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: -ms-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: linear-gradient(110deg, #f69700 5%, #e45504 110%); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); color: #fff; font-weight: bold; text-align: center; -webkit-transition: box-shadow 1s, background 1s; -moz-transition: box-shadow 1s, background 1s; -ms-transition: box-shadow 1s, background 1s; -o-transition: box-shadow 1s, background 1s; transition: box-shadow 1s, background 1s; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #entry_lk:hover { background: -webkit-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: -moz-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: -o-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: -ms-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: linear-gradient(110deg, #f69700 -30%, #e45504 25%); -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); } #entry_lk.hide { visibility: hidden; opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } @media screen and (min-width: 769px) { #entry_lk { right: clamp(0px, 1.464128843338214vw, 20px); bottom: clamp(0px, 1.464128843338214vw, 20px); width: clamp(0px, 13.90922401171303vw, 190px); height: clamp(0px, 4.685212298682284vw, 64px); border-width: clamp(0px, 0.219619326500732vw, 3px); border-radius: clamp(0px, 1.756954612005857vw, 24px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 1.464128843338214vw, 20px); } } @media screen and (max-width: 768px) { #entry_lk { bottom: clamp(0px, 6.4vw, 24px); left: 50%; width: 94.66666666666667vw; height: clamp(0px, 13.066666666666665vw, 49px); border-width: clamp(0px, 0.533333333333333vw, 2px); border-radius: clamp(0px, 7.466666666666668vw, 28px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 5.333333333333334vw, 20px); -webkit-transform: translateX(-50%); -moz-transform: translateX(-50%); -ms-transform: translateX(-50%); -o-transform: translateX(-50%); transform: translateX(-50%); } } .entry_lk { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; position: relative; margin: 0 auto; border-style: solid; border-color: #fff; background: -webkit-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: -moz-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: -o-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: -ms-linear-gradient(340deg, #f69700 5%, #e45504 110%); background: linear-gradient(110deg, #f69700 5%, #e45504 110%); -webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15); color: #fff; font-weight: bold; -webkit-transition: box-shadow 1s, background 1s; -moz-transition: box-shadow 1s, background 1s; -ms-transition: box-shadow 1s, background 1s; -o-transition: box-shadow 1s, background 1s; transition: box-shadow 1s, background 1s; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -ms-flex-align: center; } .entry_lk:hover { background: -webkit-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: -moz-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: -o-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: -ms-linear-gradient(340deg, #f69700 -30%, #e45504 25%); background: linear-gradient(110deg, #f69700 -30%, #e45504 25%); -webkit-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); } .entry_lk:hover .entry_lk_ar::before { width: 114%; height: 114%; } .entry_lk_ar { position: absolute; } .entry_lk_ar::before, .entry_lk_ar_img { position: absolute; top: 50%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .entry_lk_ar::before { left: 50%; width: 100%; height: 100%; border-radius: 50%; background-color: #fff; content: ""; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } .entry_lk_ar_img { left: 57%; } .entry_lk_txt { text-align: center; } .entry_note { text-align: center; } @media screen and (min-width: 769px) { .entry_lk { width: clamp(0px, 29.282576866764277vw, 400px); height: clamp(0px, 6.588579795021962vw, 90px); border-width: clamp(0px, 0.219619326500732vw, 3px); border-radius: clamp(0px, 2.562225475841874vw, 35px); font-size: clamp(0px, 1.244509516837482vw, 17px); line-height: clamp(0px, 2.269399707174232vw, 31px); -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } .entry_lk_ar { right: clamp(0px, 1.610541727672035vw, 22px); width: clamp(0px, 2.049780380673499vw, 28px); height: clamp(0px, 2.049780380673499vw, 28px); } .entry_lk_ar_img { width: clamp(0px, 0.512445095168375vw, 7px); height: clamp(0px, 0.732064421669107vw, 10px); } .entry_lk .bg_num { font-size: clamp(0px, 1.756954612005857vw, 24px); } .entry_lk .bg_txt { font-size: clamp(0px, 1.610541727672035vw, 22px); } .entry_note { margin-top: clamp(0px, 1.09809663250366vw, 15px); margin-bottom: clamp(0px, 0.292825768667643vw, 4px); font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.02489019033675vw, 14px); } } @media screen and (max-width: 768px) { .entry_lk { width: clamp(0px, 89.33333333333333vw, 335px); height: clamp(0px, 24vw, 90px); border-width: clamp(0px, 0.533333333333333vw, 2px); border-radius: clamp(0px, 7.466666666666668vw, 28px); font-size: clamp(0px, 4.533333333333333vw, 17px); line-height: clamp(0px, 8.266666666666666vw, 31px); -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } .entry_lk_ar { right: clamp(0px, 6.4vw, 24px); width: clamp(0px, 7.466666666666668vw, 28px); height: clamp(0px, 7.466666666666668vw, 28px); } .entry_lk_ar_img { width: clamp(0px, 1.866666666666667vw, 7px); height: clamp(0px, 2.666666666666667vw, 10px); } .entry_lk .bg_num { font-size: clamp(0px, 6.4vw, 24px); } .entry_lk .bg_txt { font-size: clamp(0px, 5.866666666666666vw, 22px); } .entry_lk_txt { margin-left: clamp(0px, 8.799999999999999vw, 33px); } .entry_lk_ar { right: clamp(0px, 8.533333333333333vw, 32px); } .entry_note { margin-top: clamp(0px, 5.066666666666666vw, 19px); font-size: clamp(0px, 3.2vw, 12px); line-height: clamp(0px, 3.2vw, 12px); } } #fv { overflow: hidden; width: 100%; } #fv_inner { position: relative; z-index: 1; height: 100%; } #fv_pts { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #fv_pts .fv_pt_it { overflow: hidden; top: 0; left: 0; width: 100%; height: 100%; } #fv_pts .fv_pt_it img { height: 100%; object-fit: cover; object-position: center; } #fv .fv_pt_it, #fv_cpw { position: absolute; } #fv_hd { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; border-radius: 30px; background-color: #4c9170; color: #fff; font-weight: bold; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #fv_entry { text-align: center; } #fv_entry_hd { font-weight: bold; } #fv .entry_note { display: none; } @media screen and (min-width: 769px) { #fv { min-height: 50.73206442166911vw; max-height: 768px; height: 100vh; padding-top: clamp(0px, 5.490483162518302vw, 75px); } #fv_pts { width: 100%; height: 100%; } #fv_pts::before { position: absolute; z-index: 1; top: 0; left: 0; width: 28%; height: 100%; background: -webkit-linear-gradient( left, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100% ); background: -moz-linear-gradient( left, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100% ); background: -o-linear-gradient( left, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100% ); background: -ms-linear-gradient( left, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100% ); background: linear-gradient( to right, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0) 100% ); content: ""; } #fv_cpw { z-index: 2; top: 8.784773060029282vw; left: 5.856515373352855vw; width: 33.96778916544656vw; } #fv_hd { width: 33.96778916544656vw; height: 2.928257686676428vw; font-size: 1.317715959004393vw; line-height: 1.903367496339678vw; } #fv_hd span { margin-left: -0.585651537335286vw; } #fv_slg { width: 33.96778916544656vw; margin-top: 2.342606149341142vw; } #fv_entry { margin-top: 3.513909224011713vw; padding: 1.903367496339678vw 0 2.342606149341142vw; border-radius: 1.171303074670571vw; background-color: rgba(255, 255, 255, 0.85); } #fv_entry_hd { font-size: 1.317715959004393vw; line-height: 1.903367496339678vw; } #fv_entry_hd .big { font-size: 1.464128843338214vw; } #fv_entry_hd .small { font-size: 0.878477306002928vw; } #fv_entry .entry_lk { width: 29.282576866764277vw; height: 6.588579795021962vw; margin-top: 0.658857979502196vw; border-width: 0.219619326500732vw; border-radius: 2.562225475841874vw; font-size: 1.244509516837482vw; line-height: 2.269399707174232vw; } #fv_entry .entry_lk .bg_num { font-size: 1.756954612005857vw; } #fv_entry .entry_lk .bg_txt { font-size: 1.610541727672035vw; } #fv_entry .entry_lk_ar { right: 1.756954612005857vw; width: 2.049780380673499vw; height: 2.049780380673499vw; } #fv_entry .entry_lk_ar_img { width: 0.512445095168375vw; height: 0.732064421669107vw; } } @media screen and (max-width: 768px) { #fv { min-height: 630px; max-height: 216.53333333333333vw; height: 90vh; padding-top: clamp(0px, 19.2vw, 72px); } #fv_pts { top: 33.06666666666666vw; width: 100%; max-height: 110.13333333333333vw; height: 50%; } #fv_pts .fv_pt_it { width: 100%; height: 100%; } #fv_cpw { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; flex-direction: column; width: 100%; height: 100%; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; -ms-flex-align: center; -webkit-flex-direction: column; -ms-flex-direction: column; } #fv_cpw_main { width: 100%; background: -webkit-linear-gradient(top, #fff 70%, transparent 100%); background: -moz-linear-gradient(top, #fff 70%, transparent 100%); background: -o-linear-gradient(top, #fff 70%, transparent 100%); background: -ms-linear-gradient(top, #fff 70%, transparent 100%); background: linear-gradient(to bottom, #fff 70%, transparent 100%); } #fv_hd { width: 89.33333333333333vw; height: 10.666666666666668vw; margin: 4.266666666666667vw auto 0; font-size: 3.466666666666666vw; line-height: 6.4vw; } #fv_slg { width: 89.33333333333333vw; height: 27.704vw; margin: 6.4vw auto 0; padding-bottom: 10.133333333333333vw; } #fv_entry { width: 100%; margin-top: auto; padding: clamp(0px, 2.339901477832512vh, 19px) 0 clamp(0px, 2.955665024630542vh, 24px); background-color: #fff; } #fv_entry_hd { font-size: clamp(0px, 2.216748768472907vh, 18px); line-height: clamp(0px, 2.832512315270936vh, 23px); } #fv_entry_hd .big { font-size: clamp(0px, 2.463054187192118vh, 20px); } #fv_entry_hd .small { font-size: clamp(0px, 1.477832512315271vh, 12px); } #fv_entry .entry_lk { width: clamp(0px, 41.256157635467986vh, 335px); height: clamp(0px, 11.083743842364532vh, 90px); margin-top: clamp(0px, 2.216748768472907vh, 18px); } #fv_entry .entry_lk_txt { font-size: clamp(0px, 2.0935960591133vh, 17px); line-height: clamp(0px, 3.817733990147783vh, 31px); } #fv_entry .entry_lk_txt .bg_num { font-size: clamp(0px, 2.955665024630542vh, 24px); } #fv_entry .entry_lk_txt .bg_txt { font-size: clamp(0px, 2.70935960591133vh, 22px); } #fv_entry .entry_lk_ar { right: clamp(0px, 2.955665024630542vh, 24px); width: clamp(0px, 3.448275862068965vh, 28px); height: clamp(0px, 3.448275862068965vh, 28px); } #fv_entry .entry_lk_ar_img { width: clamp(0px, 0.862068965517241vh, 7px); height: clamp(0px, 1.231527093596059vh, 10px); } #fv_entry .entry_lk_ar::before { width: 100%; height: 100%; border-radius: 50%; background-color: #fff; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } } .content { position: relative; } .content_tt, .content_hd { text-align: center; } .content_tt { font-weight: bold; } .content_entry_lk { background-color: #f0f2f1; background-image: url("../images/entry_lk_bg.png"); } @media screen and (min-width: 769px) { .content_inner { max-width: 1366px; margin: 0 auto; padding-top: clamp(0px, 5.856515373352855vw, 80px); padding-right: clamp(0px, 6.808199121522694vw, 93px); padding-bottom: clamp(0px, 5.856515373352855vw, 80px); padding-left: clamp(0px, 6.808199121522694vw, 93px); } .content_tt { font-size: clamp(0px, 1.610541727672035vw, 22px); line-height: clamp(0px, 1.610541727672035vw, 22px); } .content_hd { margin-top: clamp(0px, 2.342606149341142vw, 32px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } .content_entry_lk_inner { max-width: 1366px; margin: 0 auto; padding: clamp(0px, 2.928257686676428vw, 40px) 0; } } @media screen and (max-width: 768px) { .content_inner { padding-top: clamp(0px, 14.933333333333335vw, 56px); padding-right: clamp(0px, 5.333333333333334vw, 20px); padding-bottom: clamp(0px, 14.933333333333335vw, 56px); padding-left: clamp(0px, 5.333333333333334vw, 20px); } .content_tt { font-size: clamp(0px, 5.333333333333334vw, 20px); line-height: clamp(0px, 5.333333333333334vw, 20px); } .content_hd { margin-top: clamp(0px, 8.533333333333333vw, 32px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 8vw, 30px); } .content_entry_lk_inner { padding: clamp(0px, 8.533333333333333vw, 32px) clamp(0px, 5.333333333333334vw, 20px); } } .dots { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } .dot_it { border-radius: 50%; } .dot_it:not(.current) { background-color: rgba(76, 145, 112, 0.4); cursor: pointer; } .dot_it:not(.current):hover { background-color: #4c9170; } .dot_it.current { background-color: #4c9170; } .slide_it { -webkit-transition: 2s; -moz-transition: 2s; -ms-transition: 2s; -o-transition: 2s; transition: 2s; } .slide_it:not(.current) { opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } .slide_it.current { opacity: 1; -ms-filter: none; filter: none; } #preface_1 { background-color: #f2faf6; text-align: center; } #preface_1_hd { font-weight: bold; } #preface_1_txt { color: #0f1010; } #preface_2_media_list .preface_2_media_it_tt { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; border-radius: 30px; background-color: #4c9170; color: #fff; font-weight: bold; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #preface_2_media_list .preface_2_media_it_vi_it_lk { display: block; } #preface_2_media_list .preface_2_media_it_vi_it_img { overflow: hidden; width: 100%; } #preface_2_media_list .preface_2_media_it_vi_it_img img { height: 100%; object-fit: cover; object-position: center; } #preface_2_media_list .preface_2_media_it_vi_it_tt { color: #0f1010; font-weight: 500; } #preface_2_media_list .preface_2_media_it_note { width: 100%; background-color: #f2faf6; color: #0f1010; font-weight: 600; } #preface_2_media_list .preface_2_media_it_note span { display: inline-block; } @media screen and (min-width: 769px) { #preface_1_hd { margin-top: clamp(-10px, -0.732064421669107vw, 0px); font-size: clamp(0px, 2.196193265007321vw, 30px); line-height: clamp(0px, 3.367496339677892vw, 46px); } #preface_1_txt { margin-top: clamp(0px, 1.610541727672035vw, 22px); margin-bottom: clamp(-6px, -0.439238653001464vw, 0px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #preface_2 .content_inner { padding-bottom: clamp(0px, 4.758418740849195vw, 65px); } #preface_2_media_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: start; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #preface_2_media_list .preface_2_media_it { width: max-content; } #preface_2_media_list .preface_2_media_it:not(:first-child) { margin-left: clamp(0px, 2.928257686676428vw, 40px); } #preface_2_media_list .preface_2_media_it_tt { width: 100%; height: clamp(0px, 2.928257686676428vw, 40px); font-size: clamp(0px, 1.317715959004393vw, 18px); line-height: clamp(0px, 1.903367496339678vw, 26px); } #preface_2_media_list .preface_2_media_it_vi_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 2.342606149341142vw, 32px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: start; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #preface_2_media_list .preface_2_media_it_vi_it { opacity: 1 !important; -webkit-transition: 0 !important; -moz-transition: 0 !important; -ms-transition: 0 !important; -o-transition: 0 !important; transition: 0 !important; -ms-filter: none !important; filter: none !important; } #preface_2_media_list .preface_2_media_it_vi_it:not(:first-child) { margin-left: clamp(0px, 1.464128843338214vw, 20px); } #preface_2_media_list .preface_2_media_it_vi_it_lk { width: clamp(0px, 19.765739385065885vw, 270px); } #preface_2_media_list .preface_2_media_it_vi_it_img { height: clamp(0px, 13.177159590043924vw, 180px); border-radius: clamp(0px, 0.585651537335286vw, 8px); } #preface_2_media_list .preface_2_media_it_vi_it_tt { margin-top: clamp(0px, 1.244509516837482vw, 17px); font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.464128843338214vw, 20px); } #preface_2_media_list .preface_2_media_it_note { margin-top: clamp(0px, 1.756954612005857vw, 24px); padding: clamp(0px, 0.585651537335286vw, 8px) clamp(0px, 1.464128843338214vw, 20px) clamp(0px, 0.732064421669107vw, 10px); border-radius: clamp(0px, 0.585651537335286vw, 8px); font-size: clamp(0px, 0.951683748169839vw, 13px); line-height: clamp(0px, 1.464128843338214vw, 20px); } } @media screen and (max-width: 768px) { #preface_1_hd { margin-top: clamp(-5px, -1.333333333333333vw, 0px); font-size: clamp(0px, 6.4vw, 24px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #preface_1_txt { margin-top: clamp(0px, 6.4vw, 24px); margin-bottom: clamp(-4px, -1.066666666666667vw, 0px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #preface_2_media_list .preface_2_media_it:not(:first-child) { margin-top: clamp(0px, 10.666666666666668vw, 40px); } #preface_2_media_list .preface_2_media_it_tt { width: 100%; height: clamp(0px, 10.666666666666668vw, 40px); font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 11.733333333333333vw, 44px); } #preface_2_media_list .preface_2_media_it_vi_list { margin-top: clamp(0px, 6.4vw, 24px); } #preface_2_media_list .preface_2_media_it_vi_list:has(.preface_2_media_it_vi_it:nth-child(2)) { position: relative; height: 69.86666666666666vw; } #preface_2_media_list .preface_2_media_it_vi_list:has(.preface_2_media_it_vi_it:nth-child(2)) .preface_2_media_it_vi_it { position: absolute; width: 100%; height: 100%; } #preface_2_media_list .preface_2_media_it_vi_list:has(.preface_2_media_it_vi_it:nth-child(2)) .preface_2_media_it_vi_it:not(.current) { z-index: -1; } #preface_2_media_list .preface_2_media_it_vi_list:has(.preface_2_media_it_vi_it:nth-child(2)) .preface_2_media_it_vi_it_lk { width: 100%; height: 100%; } #preface_2_media_list .preface_2_media_it_vi_it_img { width: 100%; height: 59.46666666666667vw; border-radius: clamp(0px, 2.133333333333333vw, 8px); } #preface_2_media_list .preface_2_media_it_vi_it_tt { margin-top: clamp(0px, 5.600000000000001vw, 21px); font-size: clamp(0px, 3.733333333333334vw, 14px); text-align: center; line-height: clamp(0px, 5.333333333333334vw, 20px); } #preface_2_media_list .preface_2_media_it_vi_it_tt span { display: inline-block; } #preface_2_media_list .preface_2_media_it_note { margin-top: clamp(0px, 8.533333333333333vw, 32px); padding: clamp(0px, 4.8vw, 18px) clamp(0px, 4.8vw, 18px) clamp(0px, 4.8vw, 18px) clamp(0px, 5.333333333333334vw, 20px); border-radius: clamp(0px, 2.133333333333333vw, 8px); font-size: clamp(0px, 3.466666666666666vw, 13px); line-height: clamp(0px, 4.8vw, 18px); } #preface_2_media_list .preface_2_media_it .dots { margin-top: clamp(0px, 6.4vw, 24px); } #preface_2_media_list .preface_2_media_it .dot_it { width: clamp(0px, 3.2vw, 12px); height: clamp(0px, 3.2vw, 12px); } #preface_2_media_list .preface_2_media_it .dot_it:not(:first-child) { margin-left: clamp(0px, 4.266666666666667vw, 16px); } } #episode { -webkit-transition: 2s; -moz-transition: 2s; -ms-transition: 2s; -o-transition: 2s; transition: 2s; } #episode_inner { position: relative; } #episode_bg { position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100vh; -webkit-transition: 2s; -moz-transition: 2s; -ms-transition: 2s; -o-transition: 2s; transition: 2s; } #episode_bg img { height: 100%; object-fit: cover; object-position: center; } #episode_tt, #episode_hd { font-weight: bold; text-align: center; } #episode_1 { color: #fff; } #episode_1 .episode_content_it_txt.emphasize { color: #9ec0e8; } #episode_2 .episode_content_it_txt.emphasize { color: #ea5504; } #episode .episode_it { -webkit-transition: 1s; -moz-transition: 1s; -ms-transition: 1s; -o-transition: 1s; transition: 1s; } #episode .episode_content_it { width: fit-content; } #episode .episode_content_it_pts { position: sticky; } #episode .episode_content_it_img { overflow: hidden; } #episode .episode_content_it_img img { height: 100%; object-fit: cover; object-position: center; } #episode .episode_content_it_txt { font-weight: 400; } #episode .episode_content_it_txt.emphasize { font-family: "Zen Maru Gothic", sans-serif; font-weight: bold; } #episode .episode_content_it_txt.normal .or_txt, #episode .episode_content_it_txt.normal .emphasize { font-weight: bold; } #episode .episode_content_it_txt.normal .emphasize { font-family: "Zen Maru Gothic", sans-serif; } #episode .episode_content_it_txt.normal strong { font-weight: 500; } @media screen and (min-width: 769px) { #episode_hd { margin: clamp(-8px, -0.585651537335286vw, 0px) 0 clamp(-6px, -0.439238653001464vw, 0px); font-size: clamp(0px, 2.049780380673499vw, 28px); line-height: clamp(0px, 2.928257686676428vw, 40px); } #episode .episode_content { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 3.587115666178624vw, 49px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -ms-flex-align: start; } #episode .episode_content_it_pts { top: clamp(0px, 8.784773060029282vw, 120px); width: clamp(0px, 31.112737920937043vw, 425px); } #episode .episode_content_it_img { width: 100%; height: clamp(0px, 20.790629575402637vw, 284px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #episode .episode_content_it_img:not(.no1) { margin-top: clamp(0px, 2.928257686676428vw, 40px); } #episode .episode_content_it_cpw { width: clamp(0px, 50.658857979502194vw, 692px); margin-left: clamp(0px, 4.538799414348463vw, 62px); } #episode .episode_content_it_txt { white-space: nowrap; } #episode .episode_content_it_txt:not(:first-child) { margin-top: clamp(0px, 3.513909224011713vw, 48px); } #episode .episode_content_it_txt.emphasize { font-size: clamp(0px, 1.610541727672035vw, 22px); line-height: clamp(0px, 2.489019033674964vw, 34px); } #episode .episode_content_it_txt.emphasize + .episode_content_it_txt.normal { margin-top: clamp(0px, 2.708638360175696vw, 37px); } #episode .episode_content_it_txt.normal { font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.342606149341142vw, 32px); } #episode .episode_content_it_txt.normal + .episode_content_it_txt.normal { margin-top: clamp(0px, 2.562225475841874vw, 35px); } #episode .episode_content_it_txt.normal + .episode_content_it_txt.emphasize { margin-top: clamp(0px, 2.781844802342606vw, 38px); } #episode .episode_content_it_txt.normal .or_txt { font-size: clamp(0px, 1.317715959004393vw, 18px); } #episode .episode_content_it_txt.normal .big { font-size: clamp(0px, 1.610541727672035vw, 22px); } #episode_1 .episode_content_it_cpw.util_pc { margin-top: clamp(-5px, -0.366032210834553vw, 0px); } #episode_2 .episode_content_it_cpw.util_pc { margin-top: clamp(-8px, -0.585651537335286vw, 0px); } } @media screen and (max-width: 768px) { #episode_hd { margin-top: clamp(-6px, -1.6vw, 0px); font-size: clamp(0px, 5.866666666666666vw, 22px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #episode .episode_content { margin-bottom: clamp(-3px, -0.8vw, 0px); } #episode .episode_content_it_pts { margin-top: clamp(0px, 6.933333333333333vw, 26px); } #episode .episode_content_it_img { margin-right: auto; margin-left: auto; border-radius: clamp(0px, 3.2vw, 12px); } #episode .episode_content_it_img + .episode_content_it_txt { margin-top: clamp(0px, 6.933333333333333vw, 26px); } #episode .episode_content_it_txt { text-align: center; line-height: clamp(0px, 8vw, 30px); } #episode .episode_content_it_txt.emphasize { font-size: clamp(0px, 5.333333333333334vw, 20px); } #episode .episode_content_it_txt.emphasize + .episode_content_it_txt.normal { margin-top: clamp(0px, 6.4vw, 24px); } #episode .episode_content_it_txt.emphasize + .episode_content_it_txt.emphasize { margin-top: clamp(0px, 5.866666666666666vw, 22px); } #episode .episode_content_it_txt.emphasize + .episode_content_it_img { margin-top: clamp(0px, 7.733333333333333vw, 29px); } #episode .episode_content_it_txt.normal { font-size: clamp(0px, 4.266666666666667vw, 16px); } #episode .episode_content_it_txt.normal .or_txt { font-size: clamp(0px, 4.8vw, 18px); } #episode .episode_content_it_txt.normal + .episode_content_it_txt.normal { margin-top: clamp(0px, 5.866666666666666vw, 22px); } #episode .episode_content_it_txt.normal + .episode_content_it_txt.emphasize { margin-top: clamp(0px, 6.4vw, 24px); } #episode .episode_content_it_txt.normal + .episode_content_it_img { margin-top: clamp(0px, 7.199999999999999vw, 27px); } #episode_2 .episode_content_it_img { width: clamp(0px, 80vw, 300px); } } #action_hd { font-weight: bold; } #action_txt .action_txt_it { font-weight: 400; } #action_approach .action_approach_it { position: relative; background-color: #f2faf6; } #action_approach .action_approach_it_tt { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; position: absolute; top: 0; left: 50%; background-color: #13b583; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #action_approach .action_approach_it_tt_num { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; border-radius: 30px; background-color: #fff; color: #13b583; font-weight: bold; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #action_approach .action_approach_it_tt_tx { color: #fff; font-weight: bold; } #action_approach .action_approach_it_hd { font-weight: bold; } #action_approach .action_approach_it_hd .last { display: inline-block; } #action_approach .action_approach_content_tt { font-weight: bold; } #action_approach .action_approach_content_pts_list { overflow: hidden; position: relative; } #action_approach .action_approach_content_pts_list .action_approach_content_pt_it { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } #action_approach .action_approach_content_txt { font-weight: 400; } #action_approach .action_approach_content_txt .or_txt { font-weight: bold; } #action_approach .action_approach_content_ft_img { overflow: hidden; } #action_approach .action_approach_content_ft_it_tt { font-weight: bold; } #action_approach .action_approach_content_ft_it_txt_it { position: relative; font-weight: 400; } #action_approach .action_approach_content_ft_it_txt_it::before { position: absolute; top: 0; left: 0; content: "・"; } #action_approach .action_approach_other_tt { position: relative; font-weight: bold; } #action_approach .action_approach_other_tt::after { position: absolute; bottom: 0; left: 0; width: 100%; background-image: url("../images/sen.png"); content: ""; } #action_approach .action_approach_other_it { background-color: #fff; } #action_approach .action_approach_other_it_tt { font-weight: bold; } #action_approach .action_approach_other_it_txt { color: #0f1010; font-weight: 400; } #action_orien_hd { font-weight: bold; } #action_orien_txt .or_txt { font-weight: bold; } @media screen and (min-width: 769px) { #action_hd { margin-top: clamp(-10px, -2.666666666666667vw, 0px); font-size: clamp(0px, 2.196193265007321vw, 30px); line-height: clamp(0px, 3.367496339677892vw, 46px); } #action_txt { margin-top: clamp(0px, 1.244509516837482vw, 17px); } #action_txt .action_txt_it { font-size: clamp(0px, 1.171303074670571vw, 16px); text-align: center; line-height: clamp(0px, 2.196193265007321vw, 30px); } #action_txt .action_txt_it:not(:first-child) { margin-top: clamp(0px, 2.342606149341142vw, 32px); } #action_approach { margin-top: clamp(0px, 6.36896046852123vw, 87px); } #action_approach .action_approach_it { padding: clamp(0px, 5.490483162518302vw, 75px) clamp(0px, 5.856515373352855vw, 80px) clamp(0px, 4.685212298682284vw, 64px); border-radius: clamp(0px, 1.171303074670571vw, 16px); } #action_approach .action_approach_it:not(:first-child) { margin-top: clamp(0px, 6.002928257686676vw, 82px); } #action_approach .action_approach_it_tt { height: clamp(0px, 4.978038067349927vw, 68px); padding: 0 clamp(0px, 1.756954612005857vw, 24px); border-radius: clamp(0px, 1.171303074670571vw, 16px); } #action_approach .action_approach_it_tt_num { width: clamp(0px, 11.859443631039532vw, 162px); height: clamp(0px, 2.928257686676428vw, 40px); font-size: clamp(0px, 1.464128843338214vw, 20px); line-height: clamp(0px, 1.464128843338214vw, 20px); } #action_approach .action_approach_it_tt_tx { width: max-content; margin-left: clamp(0px, 1.171303074670571vw, 16px); font-size: clamp(0px, 1.610541727672035vw, 22px); line-height: clamp(0px, 3.22108345534407vw, 44px); } #action_approach .action_approach_it_hd { margin-top: clamp(-5px, -0.366032210834553vw, 0px); font-size: clamp(0px, 1.464128843338214vw, 20px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #action_approach .action_approach_it_hd .last { margin-top: clamp(0px, 0.658857979502196vw, 9px); margin-left: clamp(0px, 0.878477306002928vw, 12px); } #action_approach .action_approach_it_hd .big { font-size: clamp(0px, 2.928257686676428vw, 40px); } #action_approach .action_approach_it.no2 .action_approach_it_hd { letter-spacing: 2px; } #action_approach .action_approach_content_list { margin-top: clamp(0px, 3.660322108345535vw, 50px); } #action_approach .action_approach_content_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 2.928257686676428vw, 40px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: start; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #action_approach .action_approach_content_cpw { width: clamp(0px, 38.50658857979502vw, 526px); } #action_approach .action_approach_content_tt { margin-top: clamp(-5px, -0.366032210834553vw, 0px); font-size: clamp(0px, 1.464128843338214vw, 20px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #action_approach .action_approach_content_txt { margin-top: clamp(0px, 1.09809663250366vw, 15px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 2.049780380673499vw, 28px); } #action_approach .action_approach_content_pts { width: clamp(0px, 31.478770131771594vw, 430px); margin-left: clamp(0px, 4.685212298682284vw, 64px); } #action_approach .action_approach_content_pts_list { width: 100%; height: clamp(0px, 21.2298682284041vw, 290px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #action_approach .action_approach_content_pts .dots { margin-top: clamp(0px, 1.171303074670571vw, 16px); } #action_approach .action_approach_content_pts .dot_it { width: clamp(0px, 0.732064421669107vw, 10px); height: clamp(0px, 0.732064421669107vw, 10px); } #action_approach .action_approach_content_pts .dot_it:not(:first-child) { margin-left: clamp(0px, 1.171303074670571vw, 16px); } #action_approach .action_approach_content_ft { margin-top: clamp(0px, 3.074670571010249vw, 42px); } #action_approach .action_approach_content_ft_content { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 2.928257686676428vw, 40px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #action_approach .action_approach_content_ft_img { width: clamp(0px, 20.497803806734993vw, 280px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #action_approach .action_approach_content_ft_cpw { width: clamp(0px, 50.658857979502194vw, 692px); margin-top: clamp(-9px, -0.658857979502196vw, 0px); margin-bottom: clamp(-3px, -0.219619326500732vw, 0px); margin-left: clamp(0px, 3.513909224011713vw, 48px); } #action_approach .action_approach_content_ft_it:not(:first-child) { margin-top: clamp(0px, 1.683748169838946vw, 23px); } #action_approach .action_approach_content_ft_it_tt { font-size: clamp(0px, 1.317715959004393vw, 18px); line-height: clamp(0px, 2.342606149341142vw, 32px); } #action_approach .action_approach_content_ft_it_txt { margin-top: clamp(0px, 1.171303074670571vw, 16px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 1.756954612005857vw, 24px); } #action_approach .action_approach_content_ft_it_txt_it { margin-top: clamp(0px, 0.658857979502196vw, 9px); padding-left: clamp(0px, 1.171303074670571vw, 16px); } #action_approach .action_approach_other { margin-top: clamp(0px, 3.14787701317716vw, 43px); } #action_approach .action_approach_other_tt { padding-bottom: clamp(0px, 1.09809663250366vw, 15px); font-size: clamp(0px, 1.464128843338214vw, 20px); font-weight: bold; line-height: clamp(0px, 2.196193265007321vw, 30px); } #action_approach .action_approach_other_tt::after { height: clamp(0px, 0.146412884333821vw, 2px); } #action_approach .action_approach_other_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 2.269399707174232vw, 31px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-align: center; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } #action_approach .action_approach_other_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: clamp(0px, 22.913616398243043vw, 313px); height: clamp(0px, 9.809663250366032vw, 134px); padding: clamp(0px, 1.537335285505125vw, 21px) clamp(0px, 1.976573938506589vw, 27px); border: clamp(0px, 0.219619326500732vw, 3px) solid #4c9170; border-radius: clamp(0px, 0.585651537335286vw, 8px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #action_approach .action_approach_other_it:not(:first-child) { margin-left: clamp(0px, 2.196193265007321vw, 30px); } #action_approach .action_approach_other_it_img { width: clamp(0px, 5.417276720351391vw, 74px); height: clamp(0px, 5.417276720351391vw, 74px); } #action_approach .action_approach_other_it_cpw { width: clamp(0px, 11.200585651537336vw, 153px); margin-left: clamp(0px, 1.756954612005857vw, 24px); } #action_approach .action_approach_other_it_tt { font-size: clamp(0px, 1.317715959004393vw, 18px); font-weight: bold; line-height: clamp(0px, 1.903367496339678vw, 26px); } #action_approach .action_approach_other_it_txt { margin-top: clamp(0px, 0.658857979502196vw, 9px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #action_orien { margin-top: clamp(0px, 4.026354319180088vw, 55px); } #action_orien_hd { font-size: clamp(0px, 2.196193265007321vw, 30px); line-height: clamp(0px, 3.367496339677892vw, 46px); } #action_orien_txt { margin-top: clamp(0px, 1.244509516837482vw, 17px); margin-bottom: clamp(-3px, -0.219619326500732vw, 0px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #action_orien_txt .action_orien_txt_it:not(:first-child) { margin-top: clamp(0px, 0.878477306002928vw, 12px); } } @media screen and (max-width: 768px) { #action_hd { margin-top: clamp(-4px, -1.066666666666667vw, 0px); font-size: clamp(0px, 6.4vw, 24px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #action_txt { margin-top: clamp(0px, 6.4vw, 24px); } #action_txt .action_txt_it { font-size: clamp(0px, 4.266666666666667vw, 16px); text-align: left; line-height: clamp(0px, 8vw, 30px); } #action_approach { margin-top: clamp(0px, 27.73333333333333vw, 104px); } #action_approach .action_approach_it { padding: clamp(0px, 22.933333333333334vw, 86px) clamp(0px, 4vw, 15px) clamp(0px, 12.8vw, 48px); border-radius: clamp(0px, 4.266666666666667vw, 16px); } #action_approach .action_approach_it:not(:first-child) { margin-top: clamp(0px, 24.8vw, 93px); } #action_approach .action_approach_it.no1 .action_approach_it_hd { margin-top: clamp(-5px, -1.333333333333333vw, 0px); padding-bottom: clamp(0px, 9.6vw, 36px); border-bottom: 1px solid rgba(57, 67, 64, 0.3); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 6.4vw, 24px); } #action_approach .action_approach_it.no1 .action_approach_it_hd .last { margin-top: clamp(0px, 5.333333333333334vw, 20px); font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 7.466666666666668vw, 28px); } #action_approach .action_approach_it.no1 .action_approach_it_hd .big { font-size: clamp(0px, 8.533333333333333vw, 32px); } #action_approach .action_approach_it.no2 .action_approach_it_hd { font-size: clamp(0px, 5.333333333333334vw, 20px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #action_approach .action_approach_it_tt { flex-direction: column; width: clamp(0px, 76.53333333333333vw, 287px); height: clamp(0px, 32.800000000000004vw, 123px); border-radius: clamp(0px, 4.266666666666667vw, 16px); -webkit-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; } #action_approach .action_approach_it_tt_num { width: clamp(0px, 29.333333333333332vw, 110px); height: clamp(0px, 8vw, 30px); font-size: clamp(0px, 3.733333333333334vw, 14px); line-height: clamp(0px, 3.733333333333334vw, 14px); } #action_approach .action_approach_it_tt_tx { margin-top: clamp(0px, 1.866666666666667vw, 7px); font-size: clamp(0px, 4.8vw, 18px); text-align: center; line-height: clamp(0px, 7.466666666666668vw, 28px); } #action_approach .action_approach_content_list { margin-top: clamp(0px, 9.333333333333334vw, 35px); } #action_approach .action_approach_content_it:not(:first-child) { margin-top: clamp(0px, 13.600000000000001vw, 51px); } #action_approach .action_approach_content_tt { font-size: clamp(0px, 4.8vw, 18px); text-align: center; line-height: clamp(0px, 6.933333333333333vw, 26px); } #action_approach .action_approach_content_txt { margin-top: clamp(0px, 4.266666666666667vw, 16px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #action_approach .action_approach_content_txt .or_txt { font-size: clamp(0px, 4.266666666666667vw, 16px); } #action_approach .action_approach_content_pts { margin-top: clamp(0px, 7.199999999999999vw, 27px); } #action_approach .action_approach_content_pts_list { width: 100%; height: 54.93333333333334vw; border-radius: clamp(0px, 3.2vw, 12px); } #action_approach .action_approach_content_pts .dots { margin-top: clamp(0px, 6.4vw, 24px); } #action_approach .action_approach_content_pts .dot_it { width: clamp(0px, 3.2vw, 12px); height: clamp(0px, 3.2vw, 12px); } #action_approach .action_approach_content_pts .dot_it:not(:first-child) { margin-left: clamp(0px, 4.266666666666667vw, 16px); } #action_approach .action_approach_content_ft { margin-top: clamp(0px, 12.8vw, 48px); } #action_approach .action_approach_content_ft_content { margin-top: clamp(0px, 8.266666666666666vw, 31px); } #action_approach .action_approach_content_ft_img { width: 100%; border-radius: clamp(0px, 3.2vw, 12px); } #action_approach .action_approach_content_ft_cpw { margin-top: clamp(0px, 6.933333333333333vw, 26px); } #action_approach .action_approach_content_ft_it:not(:first-child) { margin-top: clamp(0px, 6.133333333333333vw, 23px); } #action_approach .action_approach_content_ft_it_tt { color: #0f1010; font-size: clamp(0px, 4.266666666666667vw, 16px); text-align: center; line-height: clamp(0px, 7.466666666666668vw, 28px); } #action_approach .action_approach_content_ft_it_txt { margin-top: clamp(0px, 3.466666666666666vw, 13px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #action_approach .action_approach_content_ft_it_txt_it { padding-left: clamp(0px, 4.266666666666667vw, 16px); } #action_approach .action_approach_content_ft_it_txt_it:not(:first-child) { margin-top: clamp(0px, 1.6vw, 6px); } #action_approach .action_approach_other { margin-top: clamp(0px, 8.799999999999999vw, 33px); } #action_approach .action_approach_other_tt { padding-bottom: clamp(0px, 4.533333333333333vw, 17px); font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 8vw, 30px); } #action_approach .action_approach_other_tt::after { height: clamp(0px, 0.533333333333333vw, 2px); } #action_approach .action_approach_other_list { margin-top: clamp(0px, 6.133333333333333vw, 23px); } #action_approach .action_approach_other_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: clamp(0px, 81.33333333333333vw, 305px); margin-right: auto; margin-left: auto; padding: clamp(0px, 5.333333333333334vw, 20px); border: clamp(0px, 0.8vw, 3px) solid #4c9170; border-radius: clamp(0px, 2.133333333333333vw, 8px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-align: start; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } #action_approach .action_approach_other_it:not(:first-child) { margin-top: clamp(0px, 3.2vw, 12px); } #action_approach .action_approach_other_it:nth-child(1) .action_approach_other_it_tt { margin-top: clamp(0px, 1.066666666666667vw, 4px); } #action_approach .action_approach_other_it_img { width: clamp(0px, 19.733333333333334vw, 74px); height: clamp(0px, 19.733333333333334vw, 74px); } #action_approach .action_approach_other_it_cpw { width: clamp(0px, 43.46666666666666vw, 163px); margin-left: clamp(0px, 1.464128843338214vw, 20px); } #action_approach .action_approach_other_it_tt { font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 4.266666666666667vw, 16px); } #action_approach .action_approach_other_it_txt { margin-top: clamp(0px, 3.2vw, 12px); font-size: clamp(0px, 3.733333333333334vw, 14px); line-height: clamp(0px, 5.333333333333334vw, 20px); } #action_orien { margin-top: clamp(0px, 12.8vw, 48px); } #action_orien_hd { margin-top: clamp(-5px, -1.333333333333333vw, 0px); font-size: clamp(0px, 6.4vw, 24px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #action_orien_txt { margin-top: clamp(0px, 4.266666666666667vw, 16px); margin-bottom: clamp(-3px, -0.8vw, 0px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #action_orien_txt .or_txt { font-size: clamp(0px, 4.266666666666667vw, 16px); } #action_orien_txt .or_txt.big { font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 8vw, 30px); } #action_orien_txt .action_orien_txt_it:not(:first-child) { margin-top: clamp(0px, 4vw, 15px); } } #program_2 { background-color: #f2faf6; } #program_2_hd { font-weight: bold; } #program_2_txt { font-weight: 400; } #program_2_list .program_2_it { border-style: solid; } #program_2_list .program_2_it.no1 { border-color: #007aa9; background-color: #e5f2f7; } #program_2_list .program_2_it.no2 { border-color: #f6ab00; background-color: #fff6ce; } #program_2_list .program_2_it.no3 { border-color: #ea5504; background-color: #ffe8db; } #program_2_list .program_2_it_tt, #program_2_list .program_2_it_txt { text-align: center; } #program_2_list .program_2_it_tt { font-weight: bold; } #program_2_list .program_2_it_img { overflow: hidden; } #program_2_graduates_comments { position: relative; background-color: #fff; } #program_2_graduates_comments_tt { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; position: absolute; top: 0; left: 50%; background-color: #13b583; color: #fff; font-weight: bold; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #program_2_graduates_comments_pts { position: relative; width: fit-content; margin-right: auto; margin-left: auto; } #program_2_graduates_comments_img { overflow: hidden; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it { position: absolute; background-color: #ffe8db; color: #0f1010; font-family: "Zen Maru Gothic", sans-serif; font-weight: 500; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it::after { position: absolute; bottom: 1px; background-image: url("../images/memo_ar_left.png"); background-repeat: no-repeat; background-position: center; background-size: cover; content: ""; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.left::after { -webkit-transform: translate(0, 100%); -moz-transform: translate(0, 100%); -ms-transform: translate(0, 100%); -o-transform: translate(0, 100%); transform: translate(0, 100%); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.right::after { -webkit-transform: scaleX(-1) translate(0, 100%); -moz-transform: scaleX(-1) translate(0, 100%); -ms-transform: scaleX(-1) translate(0, 100%); -o-transform: scaleX(-1) translate(0, 100%); transform: scaleX(-1) translate(0, 100%); } #program_2_graduates_foot .or_txt { display: inline-block; font-weight: bold; } @media screen and (min-width: 769px) { #program_2_hd { margin-top: clamp(-12px, -0.878477306002928vw, 0px); margin-bottom: clamp(-11px, -0.805270863836018vw, 0px); font-size: clamp(0px, 2.196193265007321vw, 30px); line-height: clamp(0px, 3.367496339677892vw, 46px); } #program_2_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 3.22108345534407vw, 44px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #program_2_list .program_2_it { width: clamp(0px, 26.79355783308931vw, 366px); padding: clamp(0px, 2.415812591508053vw, 33px) clamp(0px, 1.464128843338214vw, 20px) clamp(0px, 2.635431918008785vw, 36px); border-width: clamp(0px, 0.366032210834553vw, 5px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #program_2_list .program_2_it:not(:first-child) { margin-left: clamp(0px, 2.928257686676428vw, 40px); } #program_2_list .program_2_it_tt { font-size: clamp(0px, 1.464128843338214vw, 20px); line-height: clamp(0px, 2.049780380673499vw, 28px); } #program_2_list .program_2_it_tt span { font-size: clamp(0px, 2.342606149341142vw, 32px); } #program_2_list .program_2_it_img { width: 100%; margin-top: clamp(0px, 1.244509516837482vw, 17px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #program_2_list .program_2_it_txt { margin-top: clamp(0px, 1.09809663250366vw, 15px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #program_2_graduates_comments { margin-top: clamp(0px, 5.929721815519766vw, 81px); padding: clamp(0px, 3.513909224011713vw, 48px) clamp(0px, 5.856515373352855vw, 80px); } #program_2_graduates_comments_tt { width: clamp(0px, 22.547584187408493vw, 308px); height: clamp(0px, 3.587115666178624vw, 49px); border-radius: clamp(0px, 1.171303074670571vw, 16px); font-size: clamp(0px, 1.464128843338214vw, 20px); line-height: clamp(0px, 1.464128843338214vw, 20px); } #program_2_graduates_comments_txt { font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #program_2_graduates_comments_pts { margin-top: clamp(0px, 2.781844802342606vw, 38px); } #program_2_graduates_comments_img { position: relative; z-index: 1; width: clamp(0px, 51.244509516837475vw, 700px); border-radius: clamp(0px, 1.171303074670571vw, 16px); } #program_2_graduates_comments_memo { position: relative; z-index: 2; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it { padding: clamp(0px, 1.427525622254759vw, 19.5px) clamp(0px, 1.464128843338214vw, 20px); border-radius: clamp(0px, 3.806734992679356vw, 52px); font-size: clamp(0px, 3.733333333333334vw, 14px); line-height: clamp(0px, 4.8vw, 18px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it::after { width: clamp(0px, 1.171303074670571vw, 16px); height: clamp(0px, 0.878477306002928vw, 12px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.left { -webkit-transform: translate(-50%, 0); -moz-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); -o-transform: translate(-50%, 0); transform: translate(-50%, 0); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.left::after { right: clamp(0px, 2.635431918008785vw, 36px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.right { -webkit-transform: translate(100%, 0); -moz-transform: translate(100%, 0); -ms-transform: translate(100%, 0); -o-transform: translate(100%, 0); transform: translate(100%, 0); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.right::after { left: clamp(0px, 2.708638360175696vw, 37px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it::after { width: clamp(0px, 1.171303074670571vw, 16px); height: clamp(0px, 0.878477306002928vw, 12px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no1 { top: clamp(0px, 5.051244509516837vw, 69px); left: clamp(-27px, -1.976573938506589vw, 0px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no2 { top: clamp(0px, 14.45827232796486vw, 197.5px); left: clamp(-76px, -5.563689604685212vw, 0px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no3 { top: clamp(0px, 22.218155197657392vw, 303.5px); left: clamp(-40px, -2.928257686676428vw, 0px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no4 { top: clamp(0px, 29.026354319180086vw, 396.5px); left: clamp(-71px, -5.197657393850659vw, 0px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no5 { top: clamp(-29px, -2.12298682284041vw, 0px); right: clamp(0px, 0.878477306002928vw, 12px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no6 { top: clamp(0px, 7.174231332357247vw, 98px); right: clamp(0px, 0.439238653001464vw, 6px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no7 { top: clamp(0px, 16.764275256222547vw, 229px); right: clamp(0px, 2.12298682284041vw, 29px); } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no8 { top: clamp(0px, 26.207906295754025vw, 358px); right: clamp(0px, 2.12298682284041vw, 29px); } #program_2_graduates_foot { margin-top: clamp(0px, 3.074670571010249vw, 42px); margin-bottom: clamp(-6px, -0.439238653001464vw, 0px); font-size: clamp(0px, 1.171303074670571vw, 16px); font-weight: bold; line-height: clamp(0px, 2.196193265007321vw, 30px); } #program_2_graduates_foot .or_txt { margin-top: clamp(0px, 0.878477306002928vw, 12px); font-size: clamp(0px, 1.317715959004393vw, 18px); } } @media screen and (max-width: 768px) { #program_2_hd { margin-top: clamp(-4px, -1.066666666666667vw, 0px); font-size: clamp(0px, 6.4vw, 24px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #program_2_txt { margin-top: clamp(0px, 5.866666666666666vw, 22px); } #program_2_list { margin-top: clamp(0px, 9.866666666666667vw, 37px); } #program_2_list .program_2_it { width: 100%; padding: clamp(0px, 6.666666666666667vw, 25px) clamp(0px, 4vw, 15px) clamp(0px, 4vw, 15px); border-width: clamp(0px, 1.333333333333333vw, 5px); border-radius: clamp(0px, 3.2vw, 12px); } #program_2_list .program_2_it:not(:first-child) { margin-top: clamp(0px, 6.4vw, 24px); } #program_2_list .program_2_it_tt { font-size: clamp(0px, 5.333333333333334vw, 20px); line-height: clamp(0px, 7.466666666666668vw, 28px); } #program_2_list .program_2_it_tt span { font-size: clamp(0px, 8.533333333333333vw, 32px); } #program_2_list .program_2_it_txt { margin-top: clamp(0px, 4vw, 15px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #program_2_list .program_2_it_img { width: 100%; margin-top: clamp(0px, 6.133333333333333vw, 23px); border-radius: clamp(0px, 3.2vw, 12px); } #program_2_graduates_comments { margin-top: clamp(0px, 19.2vw, 72px); padding: clamp(0px, 11.200000000000001vw, 42px) clamp(0px, 4vw, 15px) clamp(0px, 10.666666666666668vw, 40px); border-radius: clamp(0px, 3.2vw, 12px); } #program_2_graduates_comments_tt { width: clamp(0px, 82.13333333333334vw, 308px); height: clamp(0px, 13.066666666666665vw, 49px); border-radius: clamp(0px, 4.266666666666667vw, 16px); font-size: clamp(0px, 5.333333333333334vw, 20px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #program_2_graduates_comments_txt { font-size: clamp(0px, 4vw, 15px); text-align: left; line-height: clamp(0px, 8vw, 30px); } #program_2_graduates_comments_pts { margin-top: 7.733333333333333vw; } #program_2_graduates_comments_img { width: 100%; margin-top: 4.266666666666667vw; border-radius: clamp(0px, 3.2vw, 12px); } #program_2_graduates_comments_memo { position: relative; width: 78.66666666666666vw; height: 85.86666666666667vw; margin: 0 auto; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it { padding: 3.733333333333334vw 5.333333333333334vw; border-radius: 13.866666666666665vw; font-size: 3.466666666666666vw; line-height: 4.266666666666667vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it::after { width: 4.266666666666667vw; height: 3.2vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.left::after { right: 8.533333333333333vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.right::after { left: 9.813333333333333vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no5 { top: 0; right: 0; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no2 { top: 0; left: 5.066666666666666vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no1 { top: 18vw; left: 1.333333333333333vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no6 { top: 22vw; right: 3.333333333333333vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no4 { top: 38.93333333333333vw; left: -1.066666666666667vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no7 { top: 44.16vw; right: 2vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no3 { top: 62.4vw; left: 0.266666666666667vw; } #program_2_graduates_comments_memo .program_2_graduates_comments_memo_it.no8 { top: 66.26666666666667vw; right: -0.533333333333333vw; } #program_2_graduates_foot { margin-top: clamp(0px, 8.799999999999999vw, 33px); margin-bottom: clamp(-5px, -1.333333333333333vw, 0px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 8vw, 30px); } #program_2_graduates_foot .or_txt { margin-top: clamp(0px, 3.733333333333334vw, 14px); font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 8.533333333333333vw, 32px); } } #program_3 { background-color: #e5f2f7; } #program_3_list .program_3_it { background-color: #fff; } #program_3_list .program_3_it_img { overflow: hidden; } #program_3_list .program_3_it_hd, #program_3_list .program_3_it_txt, #program_3_list .program_3_it_fr { color: #0f1010; } #program_3_list .program_3_it_hd { font-weight: bold; } #program_3_list .program_3_it_txt { font-family: "Zen Maru Gothic", sans-serif; } #program_3_list .program_3_it_txt_it .or_txt { font-weight: bold; } #program_3_list .program_3_it_fr { text-align: right; } #program_3_list .program_3_it_close { font-weight: 500; } @media screen and (min-width: 769px) { #program_3_tt { margin-top: clamp(-3px, -0.219619326500732vw, 0px); } #program_3_txt { margin-top: clamp(0px, 1.976573938506589vw, 27px); } #program_3_list { margin-top: clamp(0px, 12vw, 45px); } #program_3_list .program_3_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; padding: clamp(0px, 4.099560761346998vw, 56px) clamp(0px, 2.928257686676428vw, 40px); border-radius: clamp(0px, 0.878477306002928vw, 12px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #program_3_list .program_3_it:not(:first-child) { margin-top: clamp(0px, 2.342606149341142vw, 32px); } #program_3_list .program_3_it_img { width: clamp(0px, 23.2796486090776vw, 318px); border-radius: clamp(0px, 0.732064421669107vw, 10px); } #program_3_list .program_3_it_cpw { width: clamp(0px, 54.31918008784773vw, 742px); margin-top: clamp(-5px, -0.366032210834553vw, 0px); margin-left: clamp(0px, 2.342606149341142vw, 32px); } #program_3_list .program_3_it_hd { font-size: clamp(0px, 1.317715959004393vw, 18px); line-height: clamp(0px, 2.049780380673499vw, 28px); } #program_3_list .program_3_it_txt { margin-top: clamp(0px, 1.610541727672035vw, 22px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 1.903367496339678vw, 26px); } #program_3_list .program_3_it_txt_it:not(:first-child) { margin-top: clamp(0px, 1.171303074670571vw, 16px); } #program_3_list .program_3_it_fr { margin-top: clamp(0px, 0.732064421669107vw, 10px); font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.464128843338214vw, 20px); } } @media screen and (max-width: 768px) { #program_3_tt { margin-top: clamp(0px, 1.333333333333333vw, 5px); } #program_3_txt { margin-top: clamp(0px, 7.199999999999999vw, 27px); } #program_3_txt span { display: inline-block; } #program_3_list { margin-top: clamp(0px, 9.866666666666667vw, 37px); } #program_3_list .program_3_it { padding: clamp(0px, 6.4vw, 24px) clamp(0px, 4vw, 15px); border-radius: clamp(0px, 3.2vw, 12px); } #program_3_list .program_3_it:not(:first-child) { margin-top: clamp(0px, 6.4vw, 24px); } #program_3_list .program_3_it_pts { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } #program_3_list .program_3_it_img { width: 34.66666666666667vw; margin-left: clamp(0px, 1.333333333333333vw, 5px); border-radius: clamp(0px, 2.666666666666667vw, 10px); } #program_3_list .program_3_it_tt { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; flex-direction: column; width: 50%; -webkit-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; } #program_3_list .program_3_it_hd { margin-top: clamp(-3px, -0.8vw, 0px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #program_3_list .program_3_it_hd span { display: inline-block; } #program_3_list .program_3_it_open, #program_3_list .program_3_it_close { position: relative; width: fit-content; padding-right: clamp(0px, 5.333333333333334vw, 20px); font-size: clamp(0px, 3.2vw, 12px); font-weight: 500; line-height: clamp(0px, 3.2vw, 12px); cursor: pointer; } #program_3_list .program_3_it_open::after, #program_3_list .program_3_it_close::after { display: block; position: absolute; top: 50%; right: 0; width: clamp(0px, 3.733333333333334vw, 14px); height: clamp(0px, 3.733333333333334vw, 14px); background-image: url("../images/close_ar.png"); background-repeat: no-repeat; background-position: center; background-size: cover; content: ""; } #program_3_list .program_3_it_open:hover, #program_3_list .program_3_it_close:hover { opacity: 0.8; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter: alpha(opacity=80); } #program_3_list .program_3_it:not(.open) { cursor: pointer; } #program_3_list .program_3_it:not(.open) .program_3_it_tt { margin-left: 4.266666666666667vw; } #program_3_list .program_3_it:not(.open) .program_3_it_open { display: block; margin-top: auto; margin-right: clamp(0px, 1.6vw, 6px); margin-bottom: clamp(0px, 0.533333333333333vw, 2px); margin-left: auto; padding-right: clamp(0px, 5.333333333333334vw, 20px); font-size: clamp(0px, 3.2vw, 12px); line-height: clamp(0px, 3.2vw, 12px); } #program_3_list .program_3_it:not(.open) .program_3_it_open::after { -webkit-transform: translateY(-50%) scaleY(-1); -moz-transform: translateY(-50%) scaleY(-1); -ms-transform: translateY(-50%) scaleY(-1); -o-transform: translateY(-50%) scaleY(-1); transform: translateY(-50%) scaleY(-1); } #program_3_list .program_3_it:not(.open) .program_3_it_cpw { display: none; } #program_3_list .program_3_it:not(.open) .program_3_it_close { display: none; } #program_3_list .program_3_it.open .program_3_it_open { display: none; } #program_3_list .program_3_it.open .program_3_it_cpw { margin-top: clamp(0px, 5.066666666666666vw, 19px); padding-bottom: clamp(0px, 6.4vw, 24px); border-bottom: 1px solid rgba(57, 67, 64, 0.3); } #program_3_list .program_3_it.open .program_3_it_txt_it { font-size: clamp(0px, 3.733333333333334vw, 14px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #program_3_list .program_3_it.open .program_3_it_txt_it:has(.or_txt) { line-height: clamp(0px, 6.933333333333333vw, 26px); } #program_3_list .program_3_it.open .program_3_it_txt_it:has(.or_txt) .or_txt { font-size: clamp(0px, 4vw, 15px); } #program_3_list .program_3_it.open .program_3_it_txt_it:not(:first-child) { margin-top: clamp(0px, 4.266666666666667vw, 16px); } #program_3_list .program_3_it.open .program_3_it_fr { margin-top: clamp(0px, 3.733333333333334vw, 14px); font-size: clamp(0px, 3.2vw, 12px); line-height: clamp(0px, 5.333333333333334vw, 20px); } #program_3_list .program_3_it.open .program_3_it_close { display: block; margin: clamp(0px, 5.066666666666666vw, 19px) auto 0; } #program_3_list .program_3_it.open .program_3_it_close::after { -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } } #program_4_list .program_4_it { padding: clamp(0px, 2.928257686676428vw, 40px) clamp(0px, 2.342606149341142vw, 32px); border-radius: 16px; background-color: #fce6da; } #program_4_list .program_4_it_tt, #program_4_list .program_4_it_txt { text-align: center; } #program_4_list .program_4_it_tt { color: #0f1010; font-weight: bold; } #program_4_list .program_4_it_img { overflow: hidden; margin-right: auto; margin-left: auto; } @media screen and (min-width: 769px) { #program_4_tt { font-size: clamp(0px, 1.610541727672035vw, 22px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #program_4_txt { margin-top: clamp(0px, 2.12298682284041vw, 29px); } #program_4_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 3.294289897510981vw, 45px); -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #program_4_list .program_4_it { width: clamp(0px, 41.434846266471446vw, 566px); padding: clamp(0px, 2.562225475841874vw, 35px) clamp(0px, 2.928257686676428vw, 40px) clamp(0px, 2.928257686676428vw, 40px); } #program_4_list .program_4_it:not(:first-child) { margin-left: clamp(0px, 3.513909224011713vw, 48px); } #program_4_list .program_4_it_tt { font-size: clamp(0px, 1.317715959004393vw, 18px); line-height: clamp(0px, 2.049780380673499vw, 28px); } #program_4_list .program_4_it_txt { margin-top: clamp(0px, 0.439238653001464vw, 6px); color: #0f1010; font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #program_4_list .program_4_it_img { width: clamp(0px, 27.891654465592975vw, 381px); margin-top: clamp(0px, 2.049780380673499vw, 28px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } } @media screen and (max-width: 768px) { #program_4_tt { font-size: clamp(0px, 6.4vw, 24px); line-height: clamp(0px, 6.4vw, 24px); } #program_4_txt { margin-top: clamp(0px, 7.733333333333333vw, 29px); } #program_4_list { margin-top: clamp(0px, 7.733333333333333vw, 29px); } #program_4_list .program_4_it { width: 100%; padding: clamp(0px, 9.333333333333334vw, 35px) clamp(0px, 4vw, 15px) clamp(0px, 12.533333333333333vw, 47px); border-radius: clamp(0px, 3.2vw, 12px); } #program_4_list .program_4_it:not(:first-child) { margin-top: clamp(0px, 6.4vw, 24px); } #program_4_list .program_4_it_tt { font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 7.466666666666668vw, 28px); } #program_4_list .program_4_it_txt { margin-top: clamp(0px, 3.2vw, 12px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 6.4vw, 24px); } #program_4_list .program_4_it_img { width: 100%; margin-top: clamp(0px, 4.266666666666667vw, 16px); border-radius: clamp(0px, 3.2vw, 12px); } } #faq_1 { background-color: #f2faf6; } #faq_2 { background-color: #fff8e8; } #faq_list .faq_it { position: relative; background-color: #fff; } #faq_list .faq_it_q, #faq_list .faq_it_a { position: relative; } #faq_list .faq_it_q::before, #faq_list .faq_it_a::before { position: absolute; left: 0; font-family: "Zen Maru Gothic", sans-serif; font-weight: bold; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #faq_list .faq_it_q::before { color: #4c9170; content: "Q."; } #faq_list .faq_it_a::before { color: #ea5504; content: "A."; } #faq_list .faq_it_a a { display: inline-block; position: relative; color: #4c9170; } #faq_list .faq_it_a a::before { display: block; position: absolute; left: 0; width: 100%; height: 1px; background-color: #4c9170; content: ""; } #faq_list .faq_it_a a.w_mark::after { display: block; position: absolute; background-image: url("../images/link_mark.png"); background-repeat: no-repeat; background-position: center; background-size: cover; content: ""; -webkit-transform: translate(100%, -50%); -moz-transform: translate(100%, -50%); -ms-transform: translate(100%, -50%); -o-transform: translate(100%, -50%); transform: translate(100%, -50%); } #faq_list .faq_it_bt { position: absolute; top: 50%; right: 0; cursor: pointer; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #faq_list .faq_it_bt::before, #faq_list .faq_it_bt::after { position: absolute; top: 50%; left: 50%; width: 100%; background-color: #4c9170; content: ""; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } #faq_list .faq_it_bt::before { -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } #faq_list .faq_it_bt::after { -webkit-transform: translate(-50%, -50%) rotate(90deg); -moz-transform: translate(-50%, -50%) rotate(90deg); -ms-transform: translate(-50%, -50%) rotate(90deg); -o-transform: translate(-50%, -50%) rotate(90deg); transform: translate(-50%, -50%) rotate(90deg); } #faq_list .faq_it:not(.open) { cursor: pointer; } #faq_list .faq_it:not(.open) .faq_it_bt { pointer-events: none; } #faq_list .faq_it.open .faq_it_bt::after { -webkit-transform: translate(-50%, -50%) rotate(0deg); -moz-transform: translate(-50%, -50%) rotate(0deg); -ms-transform: translate(-50%, -50%) rotate(0deg); -o-transform: translate(-50%, -50%) rotate(0deg); transform: translate(-50%, -50%) rotate(0deg); } @media screen and (min-width: 769px) { #faq_list { margin-top: clamp(0px, 2.562225475841874vw, 35px); } #faq_list .faq_it { padding: clamp(0px, 1.756954612005857vw, 24px) clamp(0px, 2.342606149341142vw, 32px); border-radius: clamp(0px, 0.585651537335286vw, 8px); } #faq_list .faq_it:not(:first-child) { margin-top: clamp(0px, 1.317715959004393vw, 18px); } #faq_list .faq_it_q, #faq_list .faq_it_a { padding-left: clamp(0px, 2.635431918008785vw, 36px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #faq_list .faq_it_q::before, #faq_list .faq_it_a::before { top: clamp(0px, 1.09809663250366vw, 15px); font-size: clamp(0px, 1.464128843338214vw, 20px); } #faq_list .faq_it_q { margin: clamp(-6px, -0.439238653001464vw, 0px) 0; } #faq_list .faq_it_a a::before { bottom: clamp(0px, 0.292825768667643vw, 4px); } #faq_list .faq_it_a a.w_mark { margin-right: clamp(0px, 1.464128843338214vw, 20px); } #faq_list .faq_it_a a.w_mark::after { top: clamp(0px, 1.09809663250366vw, 15px); right: clamp(-9px, -0.658857979502196vw, 0px); width: clamp(0px, 0.732064421669107vw, 10px); height: clamp(0px, 0.732064421669107vw, 10px); } #faq_list .faq_it:not(.open) .faq_it_a { display: none; } #faq_list .faq_it.open .faq_it_a { margin-top: clamp(0px, 1.464128843338214vw, 20px); margin-bottom: clamp(-5px, -0.366032210834553vw, 0px); } #faq_list .faq_it_bt { width: clamp(0px, 1.756954612005857vw, 24px); height: clamp(0px, 1.756954612005857vw, 24px); } #faq_list .faq_it_bt::before, #faq_list .faq_it_bt::after { height: clamp(0px, 0.219619326500732vw, 3px); } } @media screen and (max-width: 768px) { #faq_list { margin-top: clamp(0px, 9.333333333333334vw, 35px); } #faq_list .faq_it { padding: clamp(0px, 5.600000000000001vw, 21px) clamp(0px, 5.333333333333334vw, 20px); border-radius: clamp(0px, 2.133333333333333vw, 8px); } #faq_list .faq_it:not(:first-child) { margin-top: clamp(0px, 3.2vw, 12px); } #faq_list .faq_it_q, #faq_list .faq_it_a { font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #faq_list .faq_it_q::before, #faq_list .faq_it_a::before { top: clamp(0px, 2.4vw, 9px); } #faq_list .faq_it_q { margin: clamp(-2px, -0.533333333333333vw, 0px) 0; padding-right: clamp(0px, 5.866666666666666vw, 22px); padding-left: clamp(0px, 8vw, 30px); } #faq_list .faq_it_q span { display: inline-block; } #faq_list .faq_it_q::before { font-size: clamp(0px, 4.8vw, 18px); } #faq_list .faq_it_a a::before { bottom: clamp(0px, 0.533333333333333vw, 2px); } #faq_list .faq_it_a a.w_mark { margin-right: clamp(0px, 5.333333333333334vw, 20px); } #faq_list .faq_it_a a.w_mark::after { top: clamp(0px, 2.933333333333333vw, 11px); right: clamp(-9px, -2.4vw, 0px); width: clamp(0px, 2.666666666666667vw, 10px); height: clamp(0px, 2.666666666666667vw, 10px); } #faq_list .faq_it_a::before { top: clamp(0px, 3.466666666666666vw, 13px); font-size: clamp(0px, 5.333333333333334vw, 20px); } #faq_list .faq_it:not(.open) .faq_it_a { display: none; } #faq_list .faq_it.open { padding-bottom: clamp(0px, 4.8vw, 18px); } #faq_list .faq_it.open .faq_it_a { margin-top: clamp(0px, 3.466666666666666vw, 13px); padding-left: clamp(0px, 9.6vw, 36px); } #faq_list .faq_it_bt { width: clamp(0px, 4.266666666666667vw, 16px); height: clamp(0px, 4.266666666666667vw, 16px); } #faq_list .faq_it_bt::before, #faq_list .faq_it_bt::after { height: clamp(0px, 0.8vw, 3px); } } #faq_2_list .faq_2_it_img { overflow: hidden; } #faq_2_list .faq_2_it_img_tt { font-weight: bold; } #faq_2_list .faq_2_it_txt .or_txt { font-weight: bold; } @media screen and (min-width: 769px) { #faq_2_list { margin-top: clamp(0px, 2.562225475841874vw, 35px); } #faq_2_list .faq_2_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #faq_2_list .faq_2_it:not(:first-child) { margin-top: clamp(0px, 3.14787701317716vw, 43px); } #faq_2_list .faq_2_it_img { width: clamp(0px, 15.373352855051245vw, 210px); border-radius: clamp(0px, 0.732064421669107vw, 10px); } #faq_2_list .faq_2_it_img_tt { margin-top: clamp(0px, 1.464128843338214vw, 20px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 1.171303074670571vw, 16px); } #faq_2_list .faq_2_it_cpw { width: clamp(0px, 67.49633967789165vw, 922px); margin-top: clamp(-7px, -0.512445095168375vw, 0px); margin-left: clamp(0px, 3.513909224011713vw, 48px); } #faq_2_list .faq_2_it_txt { font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #faq_2_list .faq_2_it_txt_it:not(:first-child) { margin-top: clamp(0px, 0.439238653001464vw, 6px); } } @media screen and (max-width: 768px) { #faq_2_list { margin-top: clamp(0px, 8.799999999999999vw, 33px); margin-bottom: clamp(-3px, -0.8vw, 0px); } #faq_2_list .faq_2_it:not(:first-child) { margin-top: clamp(0px, 9.866666666666667vw, 37px); } #faq_2_list .faq_2_it_img { width: 56.00000000000001vw; margin: 0 auto; border-radius: clamp(0px, 2.666666666666667vw, 10px); } #faq_2_list .faq_2_it_img_tt { margin-top: clamp(0px, 6.666666666666667vw, 25px); font-size: clamp(0px, 4.266666666666667vw, 16px); text-align: center; line-height: clamp(0px, 8vw, 30px); } #faq_2_list .faq_2_it_cpw { margin-top: clamp(0px, 3.2vw, 12px); } #faq_2_list .faq_2_it_txt { font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 8vw, 30px); } #faq_2_list .faq_2_it_txt_it:not(:first-child) { margin-top: clamp(0px, 3.733333333333334vw, 14px); } } #intro_hd, #intro_txt { font-weight: bold; } #intro_txt { color: #0f1010; } @media screen and (min-width: 769px) { #intro_hd { margin-top: clamp(0px, 1.903367496339678vw, 26px); font-size: clamp(0px, 2.196193265007321vw, 30px); line-height: clamp(0px, 3.367496339677892vw, 46px); } #intro_txt { margin-top: clamp(0px, 1.464128843338214vw, 20px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } } @media screen and (max-width: 768px) { #intro_tt { margin-top: clamp(0px, 0.533333333333333vw, 2px); } #intro_hd { margin-top: clamp(0px, 8vw, 30px); font-size: clamp(0px, 6.933333333333333vw, 26px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #intro_txt { margin-top: clamp(0px, 8vw, 30px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 6.4vw, 24px); } } #intro_1 { overflow: hidden; background-color: #f2faf6; } #intro_1_list .intro_1_it { margin-right: auto; margin-left: auto; background-color: #fff; } #intro_1_list .intro_1_it.no1 .intro_1_it_list, #intro_1_list .intro_1_it.no1 .intro_1_it_img { margin-right: auto; margin-left: auto; } #intro_1_list .intro_1_it.no1 .intro_1_it_list_it { color: #0f1010; font-weight: 400; } #intro_1_list .intro_1_it.no1 .intro_1_it_list_txt strong { font-weight: 500; } #intro_1_list .intro_1_it.no1 .intro_1_it_list_txt span { display: inline-block; } #intro_1_list .intro_1_it.no1 .intro_1_it_img { overflow: hidden; } #intro_1_list .intro_1_it.no2 .intro_1_it_img { overflow: hidden; } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw { font-weight: 400; } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw_txt { color: #0f1010; } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw_name { text-align: right; } @media screen and (min-width: 769px) { #intro_1_list { margin-top: clamp(0px, 3.294289897510981vw, 45px); } #intro_1_list .intro_1_it { width: clamp(0px, 73.20644216691069vw, 1000px); padding: clamp(0px, 3.513909224011713vw, 48px) clamp(0px, 5.856515373352855vw, 80px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #intro_1_list .intro_1_it:not(:first-child) { margin-top: clamp(0px, 2.342606149341142vw, 32px); } #intro_1_list .intro_1_it_tt { font-size: clamp(0px, 1.610541727672035vw, 22px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #intro_1_list .intro_1_it_txt { font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list, #intro_1_list .intro_1_it.no1 .intro_1_it_img { width: clamp(0px, 46.48609077598829vw, 635px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list { width: clamp(0px, 46.48609077598829vw, 635px); margin-top: clamp(0px, 2.342606149341142vw, 32px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #intro_1_list .intro_1_it.no1 .intro_1_it_list_it:not(:first-child) { margin-top: clamp(0px, 0.951683748169839vw, 13px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list_tt { width: clamp(0px, 6.808199121522694vw, 93px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list_txt .small { font-size: clamp(0px, 0.878477306002928vw, 12px); } #intro_1_list .intro_1_it.no1 .intro_1_it_img { margin-top: clamp(0px, 2.708638360175696vw, 37px); border-radius: clamp(0px, 1.171303074670571vw, 16px); } #intro_1_list .intro_1_it.no2 .intro_1_it_content { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; margin-top: clamp(0px, 2.342606149341142vw, 32px); -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #intro_1_list .intro_1_it.no2 .intro_1_it_img { width: clamp(0px, 16.83748169838946vw, 230px); border-radius: clamp(0px, 0.732064421669107vw, 10px); } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw { width: clamp(0px, 41.72767203513909vw, 570px); margin-top: clamp(-2px, -0.146412884333821vw, 0px); margin-left: clamp(0px, 2.928257686676428vw, 40px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw_name { margin-top: clamp(0px, 0.951683748169839vw, 13px); color: #0f1010; } } @media screen and (max-width: 768px) { #intro_1_list { margin-top: clamp(0px, 8vw, 30px); } #intro_1_list .intro_1_it { padding: clamp(0px, 8.533333333333333vw, 32px) clamp(0px, 4vw, 15px); border-radius: clamp(0px, 3.2vw, 12px); } #intro_1_list .intro_1_it:not(:first-child) { margin-top: clamp(0px, 6.4vw, 24px); } #intro_1_list .intro_1_it_tt { font-size: clamp(0px, 5.333333333333334vw, 20px); line-height: clamp(0px, 5.333333333333334vw, 20px); } #intro_1_list .intro_1_it_txt { font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 8vw, 30px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list, #intro_1_list .intro_1_it.no1 .intro_1_it_img { width: 100%; } #intro_1_list .intro_1_it.no1 .intro_1_it_list { margin-top: clamp(0px, 6.4vw, 24px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list_it:not(:first-child) { margin-top: clamp(0px, 5.866666666666666vw, 22px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list_txt { margin-top: clamp(0px, 3.733333333333334vw, 14px); } #intro_1_list .intro_1_it.no1 .intro_1_it_list_txt .small { font-size: clamp(0px, 3.2vw, 12px); } #intro_1_list .intro_1_it.no1 .intro_1_it_img { margin-top: clamp(0px, 7.733333333333333vw, 29px); border-radius: clamp(0px, 3.2vw, 12px); } #intro_1_list .intro_1_it.no2 .intro_1_it_content { margin-top: clamp(0px, 6.933333333333333vw, 26px); } #intro_1_list .intro_1_it.no2 .intro_1_it_img { width: 64vw; margin: 0 auto; border-radius: clamp(0px, 2.666666666666667vw, 10px); } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw { margin-top: clamp(0px, 7.466666666666668vw, 28px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw_txt { margin-right: clamp(-4px, -1.066666666666667vw, 0px); } #intro_1_list .intro_1_it.no2 .intro_1_it_cpw_name { margin-top: clamp(0px, 5.066666666666666vw, 19px); } } #media_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: max-content; -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #media_list_wrapper { overflow-x: auto; cursor: grab; } #media_list_wrapper::-webkit-scrollbar { display: none; } #media_list_wrapper.dragging { cursor: grabbing; } #media_list_wrapper.dragging a { pointer-events: none; } #media_list .media_it_txt { color: #0f1010; } #media_list .media_it_img { overflow: hidden; } #media_list .media_it_img img { height: 100%; pointer-events: none; object-fit: cover; object-position: center; } @media screen and (min-width: 769px) { #media { margin-top: clamp(0px, 5.856515373352855vw, 80px); } #media_content { margin-top: clamp(0px, 2.342606149341142vw, 32px); } #media_list .media_it { width: clamp(0px, 19.838945827232795vw, 271px); } #media_list .media_it:not(:first-child) { margin-left: clamp(0px, 2.342606149341142vw, 32px); } #media_list .media_it_img { width: 100%; height: clamp(0px, 13.177159590043924vw, 180px); border-radius: clamp(0px, 0.585651537335286vw, 8px); } #media_list .media_it_txt { margin-top: clamp(0px, 0.951683748169839vw, 13px); margin-right: clamp(-2px, -0.146412884333821vw, 0px); font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.464128843338214vw, 20px); } #media .dots { margin-top: clamp(0px, 1.756954612005857vw, 24px); } #media .dot_it { width: clamp(0px, 0.732064421669107vw, 10px); height: clamp(0px, 0.732064421669107vw, 10px); } #media .dot_it:not(:first-child) { margin-left: clamp(0px, 1.171303074670571vw, 16px); } #media_other { margin-top: clamp(0px, 2.342606149341142vw, 32px); font-size: clamp(0px, 1.464128843338214vw, 20px); line-height: clamp(0px, 1.464128843338214vw, 20px); } } @media screen and (max-width: 768px) { #media { margin-top: clamp(0px, 10.666666666666668vw, 40px); } #media_content { margin-top: clamp(0px, 6.4vw, 24px); } #media_list_wrapper { margin: 0 clamp(-20px, -5.333333333333334vw, 0px); padding: 0 clamp(0px, 5.333333333333334vw, 20px); } #media_list .media_it { width: clamp(0px, 64vw, 240px); } #media_list .media_it:not(:first-child) { margin-left: clamp(0px, 6.4vw, 24px); } #media_list .media_it_img { width: 100%; height: clamp(0px, 42.66666666666667vw, 160px); border-radius: clamp(0px, 2.133333333333333vw, 8px); } #media_list .media_it_txt { margin-top: clamp(0px, 3.733333333333334vw, 14px); font-size: clamp(0px, 3.466666666666666vw, 13px); line-height: clamp(0px, 4.8vw, 18px); } #media .dots { margin-top: clamp(0px, 6.4vw, 24px); } #media .dot_it { width: clamp(0px, 3.2vw, 12px); height: clamp(0px, 3.2vw, 12px); } #media .dot_it:not(:first-child) { margin-left: clamp(0px, 4.266666666666667vw, 16px); } #media_other { margin-top: clamp(0px, 8.533333333333333vw, 32px); font-size: clamp(0px, 4.8vw, 18px); line-height: clamp(0px, 4.8vw, 18px); } } #intro_2 { background-color: #fff8e8; } #intro_2_list { background-color: #fff; } #intro_2_list .intro_2_it_img { overflow: hidden; } #intro_2_list .intro_2_it_img img { height: 100%; object-fit: cover; object-position: center; } #intro_2_list .intro_2_it_hd { font-weight: bold; } #intro_2_list .intro_2_it_lk { display: inline-block; width: fit-content; -webkit-transition: border-bottom 0.3s; -moz-transition: border-bottom 0.3s; -ms-transition: border-bottom 0.3s; -o-transition: border-bottom 0.3s; transition: border-bottom 0.3s; } #intro_2_list .intro_2_it_lk, #intro_2_list .intro_2_it_lk_txt { position: relative; } #intro_2_list .intro_2_it_lk_txt::before, #intro_2_list .intro_2_it_lk::after { position: absolute; content: ""; } #intro_2_list .intro_2_it_lk_txt::before { bottom: 0; width: 100%; height: 1px; -webkit-transition: background-color 0.6s; -moz-transition: background-color 0.6s; -ms-transition: background-color 0.6s; -o-transition: background-color 0.6s; transition: background-color 0.6s; } #intro_2_list .intro_2_it_lk::after { top: 50%; right: 0; background-image: url("../images/link_mark.png"); background-repeat: no-repeat; background-position: center; background-size: cover; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #intro_2_list .intro_2_it_lk:hover .intro_2_it_lk_txt::before { background-color: #4c9170; } @media screen and (min-width: 769px) { #intro_2_list { margin-top: clamp(0px, 2.342606149341142vw, 32px); padding: clamp(0px, 3.660322108345535vw, 50px) clamp(0px, 2.928257686676428vw, 40px) clamp(0px, 3.513909224011713vw, 48px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #intro_2_list .intro_2_it { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: center; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #intro_2_list .intro_2_it:not(:first-child) { margin-top: clamp(0px, 1.756954612005857vw, 24px); } #intro_2_list .intro_2_it_img { width: clamp(0px, 17.569546120058565vw, 240px); height: clamp(0px, 9.297218155197658vw, 127px); border-radius: clamp(0px, 0.585651537335286vw, 8px); } #intro_2_list .intro_2_it_cpw { width: clamp(0px, 60.02928257686676vw, 820px); margin-left: clamp(0px, 2.928257686676428vw, 40px); } #intro_2_list .intro_2_it_hd, #intro_2_list .intro_2_it_txt { color: #0f1010; } #intro_2_list .intro_2_it_hd { font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.049780380673499vw, 28px); } #intro_2_list .intro_2_it_txt { margin-top: clamp(0px, 0.951683748169839vw, 13px); font-size: clamp(0px, 1.09809663250366vw, 15px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #intro_2_list .intro_2_it_lk { margin-top: clamp(0px, 1.171303074670571vw, 16px); padding-right: clamp(0px, 1.317715959004393vw, 18px); } #intro_2_list .intro_2_it_lk_txt { font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.610541727672035vw, 22px); } #intro_2_list .intro_2_it_lk::after { width: clamp(0px, 0.732064421669107vw, 10px); height: clamp(0px, 0.732064421669107vw, 10px); } } @media screen and (max-width: 768px) { #intro_2_tt { margin-top: clamp(0px, 1.066666666666667vw, 4px); } #intro_2_list { margin-top: clamp(0px, 8.799999999999999vw, 33px); padding: clamp(0px, 8.533333333333333vw, 32px) clamp(0px, 4vw, 15px); border-radius: clamp(0px, 3.2vw, 12px); } #intro_2_list .intro_2_it:not(:first-child) { margin-top: clamp(0px, 8.533333333333333vw, 32px); } #intro_2_list .intro_2_it_img { width: 100%; border-radius: clamp(0px, 2.133333333333333vw, 8px); } #intro_2_list .intro_2_it_cpw { margin-top: clamp(0px, 5.333333333333334vw, 20px); } #intro_2_list .intro_2_it_hd { font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 6.4vw, 24px); } #intro_2_list .intro_2_it_txt { margin-top: clamp(0px, 3.733333333333334vw, 14px); font-size: clamp(0px, 4vw, 15px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #intro_2_list .intro_2_it_lk { display: block; margin-top: clamp(0px, 3.466666666666666vw, 13px); margin-left: auto; padding-right: clamp(0px, 4.266666666666667vw, 16px); } #intro_2_list .intro_2_it_lk_txt { font-size: clamp(0px, 3.733333333333334vw, 14px); line-height: clamp(0px, 5.866666666666666vw, 22px); } #intro_2_list .intro_2_it_lk::after { width: clamp(0px, 2.933333333333333vw, 11px); height: clamp(0px, 2.933333333333333vw, 11px); } } #intro_3 { background-color: #f2faf6; } #intro_3_txt, #intro_3_note { color: #0f1010; } #intro_3_txt { font-weight: 400; } #intro_3_tt, #intro_3_note { font-weight: bold; } #intro_3_list { margin-right: auto; margin-left: auto; border-style: solid; border-color: #4c9170; background-color: #fff; } #intro_3_list .intro_3_it { position: relative; font-weight: bold; } #intro_3_list .intro_3_it::before { position: absolute; left: 0; content: "⚫︎"; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); } #intro_3_list .intro_3_it span { display: inline-block; } @media screen and (min-width: 769px) { #intro_3_tt { margin-top: clamp(-8px, -0.585651537335286vw, 0px); font-size: clamp(0px, 2.196193265007321vw, 30px); line-height: clamp(0px, 3.367496339677892vw, 46px); } #intro_3_txt { margin-top: clamp(0px, 1.683748169838946vw, 23px); } #intro_3_list { width: clamp(0px, 73.20644216691069vw, 1000px); margin-top: clamp(0px, 3.294289897510981vw, 45px); padding: clamp(0px, 2.049780380673499vw, 28px) clamp(0px, 13.689604685212299vw, 187px) clamp(0px, 2.269399707174232vw, 31px); border-width: clamp(0px, 0.366032210834553vw, 5px); border-radius: clamp(0px, 0.878477306002928vw, 12px); } #intro_3_list .intro_3_it { padding-left: clamp(0px, 1.317715959004393vw, 18px); font-size: clamp(0px, 1.317715959004393vw, 18px); line-height: clamp(0px, 2.489019033674964vw, 34px); } #intro_3_list .intro_3_it:not(:first-child) { margin-top: clamp(0px, 0.658857979502196vw, 9px); } #intro_3_list .intro_3_it::before { top: clamp(0px, 1.244509516837482vw, 17px); } #intro_3_note { margin-top: clamp(0px, 3.14787701317716vw, 43px); margin-bottom: clamp(-2px, -0.146412884333821vw, 0px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 2.196193265007321vw, 30px); } #intro_3_entry_lk .entry_note { margin-top: clamp(0px, 1.756954612005857vw, 24px); font-size: clamp(0px, 0.878477306002928vw, 12px); line-height: clamp(0px, 0.878477306002928vw, 12px); } #intro_3_entry_lk #intro_entry_lk { margin-top: clamp(0px, 2.635431918008785vw, 36px); margin-bottom: clamp(0px, 0.292825768667643vw, 4px); } } @media screen and (max-width: 768px) { #intro_3_tt { margin-top: clamp(-6px, -1.6vw, 0px); font-size: clamp(0px, 6.4vw, 24px); line-height: clamp(0px, 9.066666666666666vw, 34px); } #intro_3_txt { margin-top: clamp(0px, 6.133333333333333vw, 23px); } #intro_3_list { width: 100%; margin-top: clamp(0px, 7.733333333333333vw, 29px); padding: clamp(0px, 5.866666666666666vw, 22px) clamp(0px, 3.733333333333334vw, 14px); border-width: clamp(0px, 1.333333333333333vw, 5px); border-radius: clamp(0px, 3.2vw, 12px); } #intro_3_list .intro_3_it { padding-left: clamp(0px, 4.266666666666667vw, 16px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 6.933333333333333vw, 26px); } #intro_3_list .intro_3_it:not(:first-child) { margin-top: clamp(0px, 2.933333333333333vw, 11px); } #intro_3_list .intro_3_it::before { top: clamp(0px, 3.466666666666666vw, 13px); } #intro_3_note { margin-top: clamp(0px, 7.466666666666668vw, 28px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 6.4vw, 24px); } } #intro_entry_lk { display: block; position: relative; width: fit-content; margin-right: auto; margin-left: auto; color: #0f1010; font-weight: bold; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; } #intro_entry_lk::after { position: absolute; top: 50%; right: 0; background-image: url("../images/entry_ar.png"); background-repeat: no-repeat; background-position: center; background-size: cover; content: ""; -webkit-transform: translate(0, -50%); -moz-transform: translate(0, -50%); -ms-transform: translate(0, -50%); -o-transform: translate(0, -50%); transform: translate(0, -50%); } #intro_entry_lk_txt { display: inline-block; position: relative; } #intro_entry_lk_txt::after { display: block; position: absolute; bottom: -2px; left: 0; width: 100%; height: 1px; background-color: #394340; opacity: 0; content: ""; -webkit-transition: 0.3s; -moz-transition: 0.3s; -ms-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; filter: alpha(opacity=0); } #intro_entry_lk:hover #intro_entry_lk_txt::after { opacity: 1; -ms-filter: none; filter: none; } @media screen and (min-width: 769px) { #intro_entry_lk { margin-top: clamp(0px, 2.342606149341142vw, 32px); padding-right: clamp(0px, 1.756954612005857vw, 24px); font-size: clamp(0px, 1.171303074670571vw, 16px); line-height: clamp(0px, 1.171303074670571vw, 16px); } #intro_entry_lk::after { width: clamp(0px, 0.732064421669107vw, 10px); height: clamp(0px, 1.09809663250366vw, 15px); } #intro_entry_lk:hover::after { right: clamp(-2px, -0.146412884333821vw, 0px); } } @media screen and (max-width: 768px) { #intro_entry_lk { margin-top: clamp(0px, 9.333333333333334vw, 35px); margin-bottom: clamp(0px, 1.066666666666667vw, 4px); padding-right: clamp(0px, 5.866666666666666vw, 22px); font-size: clamp(0px, 4.266666666666667vw, 16px); line-height: clamp(0px, 4.266666666666667vw, 16px); } #intro_entry_lk::after { width: clamp(0px, 2.666666666666667vw, 10px); height: clamp(0px, 3.733333333333334vw, 14px); } #intro_entry_lk:hover::after { right: clamp(-2px, -0.533333333333333vw, 0px); } } #footer { position: relative; z-index: 2; background-color: #4c9170; color: #fff; } #footer_inner { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; } #footer_contact_nm { font-weight: bold; } #footer_pg_top { position: relative; } #footer_pg_top::after { position: absolute; top: 50%; background-image: url("../images/page_top_ar.png"); background-repeat: no-repeat; background-position: center; background-size: cover; content: ""; -webkit-transition: top 0.3s; -moz-transition: top 0.3s; -ms-transition: top 0.3s; -o-transition: top 0.3s; transition: top 0.3s; -webkit-transform: translate(100%, -50%); -moz-transform: translate(100%, -50%); -ms-transform: translate(100%, -50%); -o-transform: translate(100%, -50%); transform: translate(100%, -50%); } #footer_pg_top:hover::after { top: 40%; } @media screen and (min-width: 769px) { #footer_inner { padding: clamp(0px, 4.099560761346998vw, 56px) clamp(0px, 6.808199121522694vw, 93px) clamp(0px, 2.342606149341142vw, 32px); -webkit-box-lines: multiple; -moz-box-lines: multiple; -o-box-lines: multiple; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-pack: justify; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; } #footer_lg_lk { width: clamp(0px, 8.345534407027818vw, 114px); } #footer_nav_ctn { width: 80%; } #footer_nav_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: end; -moz-box-pack: end; -o-box-pack: end; -ms-flex-align: center; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; } #footer_nav_list .nav_it:not(:first-child) { margin-left: clamp(0px, 1.756954612005857vw, 24px); } #footer_nav_list .nav_it_lk { font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.02489019033675vw, 14px); } #footer_contact { width: 100%; margin-top: clamp(0px, 1.610541727672035vw, 22px); font-size: clamp(0px, 1.02489019033675vw, 14px); line-height: clamp(0px, 1.464128843338214vw, 20px); } #footer_contact_ad { margin-top: clamp(0px, 1.02489019033675vw, 14px); } #footer_bottom { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: 100%; margin-top: clamp(0px, 3.513909224011713vw, 48px); -webkit-align-items: flex-end; align-items: flex-end; -webkit-box-align: end; -moz-box-align: end; -o-box-align: end; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-align: end; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; } #footer_sns_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: center; -ms-flex-pack: start; -webkit-justify-content: flex-start; justify-content: flex-start; } #footer_sns_list .sns_it:not(:first-child) { margin-left: clamp(0px, 1.756954612005857vw, 24px); } #footer_sns_list .sns_it_lk { width: clamp(0px, 2.049780380673499vw, 28px); height: clamp(0px, 2.049780380673499vw, 28px); } #footer_cr { margin-bottom: clamp(0px, 0.219619326500732vw, 3px); margin-left: clamp(-44px, -3.22108345534407vw, 0px); font-size: clamp(0px, 0.878477306002928vw, 12px); line-height: clamp(0px, 0.878477306002928vw, 12px); } #footer_pg_top { width: clamp(0px, 4.099560761346998vw, 56px); height: clamp(0px, 0.732064421669107vw, 10px); margin-right: clamp(0px, 1.464128843338214vw, 20px); } #footer_pg_top::after { right: clamp(-8px, -0.585651537335286vw, 0px); width: clamp(0px, 0.878477306002928vw, 12px); height: clamp(0px, 0.439238653001464vw, 6px); } } @media screen and (max-width: 768px) { #footer_inner { flex-direction: column; padding: clamp(0px, 14.933333333333335vw, 56px) clamp(0px, 5.333333333333334vw, 20px) clamp(0px, 9.066666666666666vw, 34px); -webkit-box-orient: vertical; -moz-box-orient: vertical; -o-box-orient: vertical; -webkit-flex-direction: column; -ms-flex-direction: column; } #footer_lg_lk { width: clamp(0px, 30.4vw, 114px); margin: 0 auto; -webkit-box-ordinal-group: 1; -moz-box-ordinal-group: 1; -o-box-ordinal-group: 1; -ms-flex-order: 1; -webkit-order: 1; order: 1; } #footer_nav_ctn { width: 100%; margin-top: clamp(0px, 11.200000000000001vw, 42px); -webkit-box-ordinal-group: 3; -moz-box-ordinal-group: 3; -o-box-ordinal-group: 3; -ms-flex-order: 3; -webkit-order: 3; order: 3; } #footer_nav_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; -webkit-align-items: flex-start; align-items: flex-start; -webkit-box-align: start; -moz-box-align: start; -o-box-align: start; -webkit-box-lines: multiple; -moz-box-lines: multiple; -o-box-lines: multiple; -webkit-box-pack: start; -moz-box-pack: start; -o-box-pack: start; -ms-flex-align: start; -ms-flex-pack: start; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: flex-start; justify-content: flex-start; } #footer_nav_list .nav_it { width: 50%; } #footer_nav_list .nav_it:nth-child(n + 3) { margin-top: clamp(0px, 5.600000000000001vw, 21px); } #footer_nav_list .nav_it_lk { font-size: clamp(0px, 3.733333333333334vw, 14px); line-height: clamp(0px, 7.466666666666668vw, 28px); } #footer_contact { width: 100%; margin-top: clamp(0px, 8.799999999999999vw, 33px); -webkit-box-ordinal-group: 2; -moz-box-ordinal-group: 2; -o-box-ordinal-group: 2; -ms-flex-order: 2; -webkit-order: 2; order: 2; } #footer_contact_nm, #footer_contact_ad { text-align: center; } #footer_contact_nm { font-size: clamp(0px, 3.733333333333334vw, 14px); } #footer_contact_ad { margin-top: clamp(0px, 5.066666666666666vw, 19px); font-size: clamp(0px, 3.466666666666666vw, 13px); line-height: clamp(0px, 4.8vw, 18px); } #footer_bottom { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: 100%; margin-top: clamp(0px, 11.466666666666667vw, 43px); -webkit-align-items: flex-end; align-items: flex-end; -webkit-box-align: end; -moz-box-align: end; -o-box-align: end; -webkit-box-lines: multiple; -moz-box-lines: multiple; -o-box-lines: multiple; -webkit-box-ordinal-group: 5; -moz-box-ordinal-group: 5; -o-box-ordinal-group: 5; -webkit-box-pack: justify; -moz-box-pack: justify; -o-box-pack: justify; -ms-flex-align: end; -ms-flex-order: 5; -ms-flex-pack: justify; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: space-between; justify-content: space-between; -webkit-order: 5; order: 5; } #footer_sns { width: 100%; } #footer_sns_list { display: -webkit-box; display: -moz-box; display: -webkit-flex; display: -ms-flexbox; display: box; display: flex; width: 100%; -webkit-align-items: center; align-items: center; -webkit-box-align: center; -moz-box-align: center; -o-box-align: center; -webkit-box-pack: center; -moz-box-pack: center; -o-box-pack: center; -ms-flex-align: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; } #footer_sns_list .sns_it:not(:first-child) { margin-left: clamp(0px, 6.4vw, 24px); } #footer_sns_list .sns_it_lk { width: clamp(0px, 7.466666666666668vw, 28px); height: clamp(0px, 7.466666666666668vw, 28px); } #footer_cr, #footer_pg_top { margin-top: clamp(0px, 10.933333333333334vw, 41px); } #footer_cr { font-size: clamp(0px, 3.2vw, 12px); line-height: clamp(0px, 3.2vw, 12px); } #footer_pg_top { width: clamp(0px, 14.933333333333335vw, 56px); height: clamp(0px, 2.666666666666667vw, 10px); margin-right: clamp(0px, 5.333333333333334vw, 20px); } #footer_pg_top::after { right: clamp(-6px, -1.6vw, 0px); width: clamp(0px, 3.2vw, 12px); height: clamp(0px, 1.6vw, 6px); } } /* yamamoto記載 */ img[src*="aax-fe.amazon-adsystem.com/s/iui3?d=forester-did"] { height: 0px !important; }