@charset "UTF-8"; html, body, div, span, applet, 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, center, 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 { margin: 0; padding: 0; border: 0; font: inherit; font-size: 100%; vertical-align: baseline; } html { line-height: 1; } ol, ul { list-style: none; } table { border-collapse: collapse; border-spacing: 0; } caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; } q, blockquote { quotes: none; } q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; } a img { border: none; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } @font-face { font-family: 'ShipporiMinchoB1'; font-style: normal; font-weight: 300; src: url(../font/ShipporiMinchoB1-Regular.woff2) format("woff2"), url(../font/ShipporiMinchoB1-Regular.woff) format("woff"), url(../font/ShipporiMinchoB1-Regular.ttf) format("truetype"); } @font-face { font-family: 'ShipporiMinchoB1'; font-style: bold; font-weight: 700; src: url(../font/ShipporiMinchoB1-SemiBold.woff2) format("woff2"), url(../font/ShipporiMinchoB1-SemiBold.woff) format("woff"), url(../font/ShipporiMinchoB1-SemiBold.ttf) format("truetype"); } @font-face { font-family: 'EBGaramond'; font-style: normal; font-weight: 300; src: url(../font/EBGaramond-Medium.woff2) format("woff2"), url(../font/EBGaramond-Medium.woff) format("woff"), url(../font/EBGaramond-Medium.ttf) format("truetype"); } .sp-only { display: none !important; } @media screen and (max-width: 767px) { .pc-only { display: none !important; } .sp-only { display: block !important; } } header#re-header { font-family: "ShipporiMinchoB1", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; position: fixed; top: 0; left: 50%; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); display: flex; align-items: center; justify-content: space-between; width: 100%; z-index: 999; -webkit-transition: background-color .3s; transition: background-color .3s; } header#re-header.header_active { box-shadow: 0 0 8px black !important; } header#re-header.header_active nav > ul.header_pc-only { position: relative; } header#re-header.header_active nav > ul.header_pc-only.head_underline:after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 2px; background-color: #00A33E; -webkit-transition: all .3s; transition: all .3s; } header#re-header.header_active nav > ul.header_pc-only .li_active p:after { top: 80%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } header#re-header.header_white, header#re-header.re-under { background-color: #fff; box-shadow: 0 0 8px rgba(0, 0, 0, 0.18); } header#re-header.header_white h1 a img, header#re-header.re-under h1 a img { display: none; } header#re-header.header_white h1 a img:last-child, header#re-header.re-under h1 a img:last-child { display: block; } header#re-header.header_white nav > ul.header_pc-only > li:last-child div a:last-child, header#re-header.re-under nav > ul.header_pc-only > li:last-child div a:last-child { background-color: #00A33E; } header#re-header.header_white nav > ul.header_pc-only > li .p-head_link, header#re-header.re-under nav > ul.header_pc-only > li .p-head_link { color: #000; } header#re-header.header_white nav > ul.header_pc-only > li .p-head_link:after, header#re-header.re-under nav > ul.header_pc-only > li .p-head_link:after { border-top: 2px solid #000; border-right: 2px solid #000; } header#re-header h1 { width: 14.2%; max-width: 202px; min-width: 120px; margin-left: 2%; } @media screen and (max-width: 1676px) { header#re-header h1 { width: 12.2%; margin-left: 2vw; } } @media screen and (max-width: 1450px) { header#re-header h1 { margin-left: 29px; } } header#re-header h1 a img { display: block; } header#re-header h1 a img:last-child { display: none; } header#re-header nav { width: 100%; max-width: 1424px; } header#re-header nav .header_hamburger-only { display: none; } header#re-header nav > ul.header_pc-only { display: flex; align-items: center; justify-content: flex-end; } header#re-header nav > ul.header_pc-only > li { margin: 0 28px; } @media screen and (max-width: 1676px) { header#re-header nav > ul.header_pc-only > li { margin: 0 1.67vw; } } header#re-header nav > ul.header_pc-only > li:last-child { margin-right: 0; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box { display: flex; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a { color: #fff; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a.re-nav_search { display: flex; background-color: #484848; align-items: center; justify-content: center; padding: 25px; } @media screen and (max-width: 1676px) { header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a.re-nav_search { padding: 1.492vw; } } @media screen and (max-width: 1450px) { header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a.re-nav_search { padding: 21.64px; } } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a.re-nav_search img { width: 100%; max-width: 34px; vertical-align: middle; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a:last-child { display: flex; align-items: center; background-color: #000; padding: 29px 39px 21px; font-size: 20px; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a:last-child img { width: 100%; max-width: 40px; vertical-align: middle; margin-left: 15px; } @media screen and (max-width: 1676px) { header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a:last-child { padding: 1.73vw 2.563vw 1.253vw; font-size: 1.18vw; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a:last-child img { width: 26%; margin-left: 0.9vw; } } @media screen and (max-width: 1450px) { header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a:last-child { padding: 25px 37.16px 25px; font-size: 17.1px; } header#re-header nav > ul.header_pc-only > li:last-child .re-nav_link_box a:last-child img { margin-left: 13px; } } header#re-header nav > ul.header_pc-only > li:last-child .header_slide_inner_search form { width: 100%; text-align: center; } header#re-header nav > ul.header_pc-only > li:last-child .header_slide_inner_search .nav_search { width: 80%; max-width: 1000px; text-align: left; font-size: 18px; font-weight: bold; padding: 20px 0 10px; border: none; border-bottom: 3px solid #00A23E; background-color: unset; } header#re-header nav > ul.header_pc-only > li:last-child .header_slide_inner_search button { border: none; background: none; cursor: pointer; width: 100%; max-width: 36px; padding: 0; vertical-align: bottom; margin-left: -40px; margin-bottom: 10px; } header#re-header nav > ul.header_pc-only > li:last-child .header_slide_inner_search button:hover { opacity: 0.7; } header#re-header nav > ul.header_pc-only > li .p-head_link { color: #fff; padding-right: 35px; position: relative; font-size: 20px; cursor: pointer; } @media screen and (max-width: 1676px) { header#re-header nav > ul.header_pc-only > li .p-head_link { padding-right: 2.09vw; font-size: 1.18vw; } } header#re-header nav > ul.header_pc-only > li .p-head_link:after { content: ""; position: absolute; top: 50%; right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 10px; height: 10px; margin-top: -10px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(135deg); transform: rotate(135deg); -webkit-transition: transform .3s; transition: transform .3s; } header#re-header nav > ul.header_pc-only > li .header_slide { display: none; position: fixed; top: 0; left: 0; width: 100%; padding: 35px 50px; background-color: rgba(255, 255, 255, 0.9); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner { width: 95%; max-width: 1280px; margin: auto; position: relative; display: flex; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content { max-width: 455px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content.border-right { padding-right: 50px; margin-right: 50px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content:nth-child(2) > ul > li p { max-width: 44px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content .header_sub_title { margin-bottom: 35px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li { border: none; display: flex; align-items: center; max-width: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li p { width: 50%; max-width: 70px; margin-right: 20px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li div { letter-spacing: -0.04em; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li div a, header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li div span { line-height: 1.4; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li div a { font-size: 16px; font-weight: bold; display: inline-block; position: relative; padding-right: 20px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li div a:after { content: ""; position: absolute; top: 50%; right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 12px; height: 12px; background-image: url("../images/top/icon_gaibu.png"); background-repeat: no-repeat; background-size: contain; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_inner_sns .header_slide_content > ul > li div span { font-size: 15px; display: block; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_fan .header_slide_content:first-child { width: auto; margin-right: 30px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner.header_slide_fan .header_slide_content > ul > li { margin: 0 15px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content { width: 100%; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.border-right { margin-right: 20px; padding-right: 20px; border-right: 1px solid #999998; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_m { width: 48%; max-width: 323px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_s { width: 44%; max-width: 283px; margin-top: calc(1em + 12px); } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_s > ul.header_list_wrap > li { margin: 0 0 16px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_s > ul > li a { position: relative; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_s > ul > li a span { position: absolute; top: 50%; left: 15px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); padding: 0; border: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_s > ul > li a span:after { content: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content.header_slide_content_s > ul > li.border-none ul li.border-none-link a span:after { content: ""; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content .header_sub_title { font-size: 18px; margin-bottom: 12px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content .header_sub_title a { padding-left: 38px; position: relative; text-decoration: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content .header_sub_title a:before { content: ""; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 26px; height: 26px; background-image: url(../images/header/link_arrow.png); background-repeat: no-repeat; background-size: contain; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul { display: flex; align-items: flex-start; justify-content: flex-start; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul li { border: 1px solid #9D9D9D; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap { flex-wrap: wrap; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap > li { margin: 0 12px 20px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap > li:last-child { margin-bottom: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap2 { margin-right: 27px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap2 > li { width: calc(33.333% - 19px); margin: 0 14px 20px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap2 > li:nth-child(3n) { margin-right: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap2 > li:nth-child(3n+1) { margin-left: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap2 > li:nth-child(4), header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.header_list_wrap2 > li:nth-child(5) { margin-bottom: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.commodity_list { margin-top: 20px; justify-content: flex-end; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul.commodity_list > li a span { padding: 15px 23px; border-bottom: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li { width: 100%; max-width: 302px; margin: 0 12px; position: relative; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li:first-child { margin-left: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li:last-child { margin-right: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a { display: block; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a span { padding: 20px 23px; font-size: 18px; display: block; position: relative; line-height: 1.2; border-bottom: 1px solid #9D9D9D; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a span:after { content: ""; position: absolute; top: 50%; right: 20px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 18px; height: 10px; background-image: url(../images/header/btn_green.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a span.head_line2 { padding: 9px 23px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a img { display: block; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a div { display: flex; align-items: center; padding: 15px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a div img { width: 100%; max-width: 78px; border: 1px solid #D6D6D6; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li a div p { font-size: 14px; margin-left: 15px; line-height: 1.4; letter-spacing: -0.04em; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none { border: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none > ul > li { margin-bottom: 14px; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none > ul > li:last-child { margin-bottom: 0; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none > ul > li.border-none-link { border: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none > ul > li.border-none-link a span { padding: 0 0 0 26px; font-size: 15px; left: 0; -webkit-transform: none; transform: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none > ul > li.border-none-link a span:after { right: auto; left: 0; width: 18px; height: 18px; background-image: url(../images/header/link_arrow_green.png); } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .header_slide_content > ul > li.border-none > ul > li a span { padding: 12px 23px; border-bottom: none; } header#re-header nav > ul.header_pc-only > li .header_slide .header_slide_inner .close { position: absolute; top: 0; right: -70px; width: 100%; max-width: 27px; cursor: pointer; } header#re-header .re-hamburger_search { display: none; } header#re-header .navToggle { display: none; } @media screen and (max-width: 1450px) { header#re-header { left: 0; -webkit-transform: none; transform: none; min-width: 1450px; } header#re-header nav > ul.header_pc-only > li { margin: 0 24.2px; } header#re-header nav > ul.header_pc-only > li .p-head_link { padding-right: 30.3px; font-size: 17.1px; } header#re-header nav > ul.header_pc-only > li .header_slide { min-width: 1450px; } } @media screen and (max-width: 767px) { header#re-header { min-width: unset; left: 50%; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); padding: 7%; } header#re-header.header_white, header#re-header.re-under { border-bottom: 1px solid #D6D6D6; } header#re-header.header_white .navToggle span, header#re-header.re-under .navToggle span { border-bottom: solid 2px #000; } header#re-header .navToggle { display: block; position: fixed; top: 36%; right: 6%; width: 9vw; height: 3.4vw; cursor: pointer; z-index: 999; text-align: center; } header#re-header .navToggle span { display: block; position: absolute; width: 100%; border-bottom: solid 2px #fff; -webkit-transition: .35s ease-in-out; -moz-transition: .35s ease-in-out; transition: .35s ease-in-out; left: 0; } header#re-header .navToggle span:nth-child(1) { top: 0; } header#re-header .navToggle span:nth-child(2) { top: 100%; } header#re-header .navToggle.active span:nth-child(1) { top: 50%; border-bottom: solid 2px #000; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); transform: rotate(-45deg); } header#re-header .navToggle.active span:nth-child(2) { top: 50%; border-bottom: solid 2px #000; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg); } header#re-header h1 { width: 54%; max-width: none; min-width: auto; margin-left: 0; z-index: 999; } header#re-header nav { width: 100%; max-width: none; } header#re-header nav > ul.header_pc-only { display: none; } header#re-header nav > ul.header_pc-only > li .header_slide { min-width: unset; } header#re-header nav .header_hamburger-only { display: block; width: 100%; height: 100vh; background-color: #fff; position: fixed; top: calc(100% + 1px); left: 0; z-index: 997; -webkit-transform: translateX(100%); transform: translateX(100%); opacity: 0; -webkit-transition: all .3s; transition: all .3s; } header#re-header nav .header_hamburger-only.re-nav_active { opacity: 1; -webkit-transform: translateX(0%); transform: translateX(0%); overflow-y: overlay; overflow-x: hidden; } header#re-header nav .header_hamburger-only.scroll_off { overflow-y: unset; overflow-x: unset; } header#re-header nav .header_hamburger-only .header_hamburger_parentlist { padding-top: 15vw; } header#re-header nav .header_hamburger-only .header_hamburger_parentlist > li { width: 85%; padding: 6.5vw 0; font-size: 5.5vw; margin: auto; border-bottom: 1px solid #D6D6D6; cursor: pointer; position: relative; } header#re-header nav .header_hamburger-only .header_hamburger_parentlist > li:after { content: ""; position: absolute; top: 50%; right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 6.2vw; height: 3.2vw; background-image: url(../images/header/btn_green.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav .header_hamburger-only .header_hamburger_parentlist > li:last-child { border-bottom: none; text-align: center; padding: 6.5vw 0; } header#re-header nav .header_hamburger-only .header_hamburger_parentlist > li:last-child:after { content: none; } header#re-header nav .header_hamburger-only .header_hamburger_childlist { display: none; width: 100%; height: 100vh; background-color: #fff; position: fixed; top: 0; left: 0; z-index: 998; -webkit-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all .3s; transition: all .3s; overflow-y: overlay; } header#re-header nav .header_hamburger-only .header_hamburger_childlist.header_hamburger_childlist_active { -webkit-transform: translateX(0%); transform: translateX(0%); } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li { display: none; position: relative; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li .header_hamburger_subtitle { background-color: #F2F2F2; position: absolute; top: 0; left: 0; width: 100%; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li .header_hamburger_subtitle span { display: block; width: 85%; font-size: 4.8vw; margin: auto; padding: 6.5vw 8%; cursor: pointer; position: relative; font-weight: bold; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li .header_hamburger_subtitle span:after { content: ""; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%) scale(-1, 1); transform: translate(0%, -50%) scale(-1, 1); width: 6.2vw; height: 3.2vw; background-image: url(../images/header/btn_green.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul { padding-top: 19vw; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li { width: 85%; font-size: 4.3vw; margin: auto; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li > p { border-bottom: 1px solid #D6D6D6; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li p { padding: 6.5vw 0; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li p a { position: relative; display: block; text-decoration: none; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li p a:after { content: ""; position: absolute; top: 50%; right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 3vw; height: 5vw; background-image: url(../images/header/arrow.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li .re-hamburger_link { border-bottom: none; font-weight: bold; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li .re-hamburger_link a { padding-left: 9%; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li .re-hamburger_link a:before { content: ""; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 4.8vw; height: 4.8vw; background-image: url(../images/header/link_arrow_green.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li .re-hamburger_link a:after { content: none; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li ul { padding-left: 3em; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li ul li { border-bottom: 1px solid #D6D6D6; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div { margin-top: 5%; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div a { border: 1px solid #D6D6D6; border-radius: 8px; font-weight: bold; padding: 8%; box-shadow: 0 4px 0 #d6d6d6; display: inline-block; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div a p { padding: 0; position: relative; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div a p:first-child { padding-left: 14%; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div a p:first-child:after { content: ""; position: absolute; top: 50%; right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 4vw; height: 4vw; background-image: url(../images/top/icon_gaibu.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div a p:last-child { margin-top: 8%; font-size: 3.5vw; line-height: 1.5; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div.re-insta p:first-child:before { content: ""; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 7vw; height: 7vw; background-image: url(../images/top/icon_insta.png); background-size: contain; background-repeat: no-repeat; } header#re-header nav .header_hamburger-only .header_hamburger_childlist > li > ul > li div.re-fan p:first-child:before { content: ""; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 7.5vw; height: 7.5vw; background-image: url(../images/top/icon_fando.png); background-size: contain; background-repeat: no-repeat; } header#re-header .re-hamburger_search { display: block; } header#re-header .re-hamburger_search a { display: block; position: fixed; top: 27%; right: 23%; width: 8vw; cursor: pointer; z-index: 999; } header#re-header .re-hamburger_search .re-hamburger_search_inner { display: none; position: fixed; top: 0; left: 0; width: 100%; padding: 10% 10% 4%; background-color: rgba(255, 255, 255, 0.9); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } header#re-header .re-hamburger_search .re-hamburger_search_inner form { position: relative; } header#re-header .re-hamburger_search .re-hamburger_search_inner .nav_search { width: 100%; font-size: 4vw; padding: 5% 0; text-align: left; font-weight: bold; border: none; border-bottom: 3px solid #00A23E; background-color: unset; } header#re-header .re-hamburger_search .re-hamburger_search_inner button { width: 10%; border: none; background: none; cursor: pointer; padding: 0; vertical-align: bottom; position: absolute; top: 50%; right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); } header#re-header .re-hamburger_search .re-hamburger_search_inner .re-hamburger_search_arrow { width: 6.7%; margin: 10% auto 0; } } footer#re-footer { font-family: "ShipporiMinchoB1", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; background-color: #FAFAFA; } footer#re-footer .re-footer_contact { background-color: #F8F8F4; position: relative; } footer#re-footer .re-footer_contact:before { content: ""; position: absolute; bottom: 0; left: 0; width: 50%; height: 2px; background-color: #00A33E; } footer#re-footer .re-footer_contact:after { content: ""; position: absolute; bottom: 0; right: 0; width: 50%; height: 2px; background-color: #EA5521; } footer#re-footer .re-footer_contact .re-footer_contact_inner { width: 95%; max-width: 1280px; margin: auto; display: flex; align-items: flex-start; padding: 90px 0 75px; position: relative; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column { width: 20%; max-width: 222px; margin-right: 4.6%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column h2 { font-size: 32px; margin-bottom: 35px; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column a { display: block; font-size: 15px; border: 1px solid #000; border-radius: 22px; padding: 12px 23px; position: relative; text-align: center; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column a:after { content: ""; position: absolute; top: calc(50% - 2px); right: 12px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 19px; height: 10px; background-image: url(../images/top/btn.png); background-size: contain; background-repeat: no-repeat; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column { width: calc(100% - 222px); margin-left: 4.6%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul { display: flex; align-items: flex-start; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li { width: 100%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li:first-child { border-right: 1px solid #C4CCBE; padding-right: 12%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li:last-child { padding-left: 12%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_head { font-size: 18px; position: relative; padding-left: 30px; font-weight: bold; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_head:before { content: ""; position: absolute; top: calc(50% + 3px); left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 21px; height: 23px; background-image: url(../images/footer/icon_tell.png); background-size: contain; background-repeat: no-repeat; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel { font-size: 43px; font-weight: bold; margin: 15px auto; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel a, footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel span { text-decoration: none; position: relative; padding-left: 52px; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel a:before, footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel span:before { content: ""; position: absolute; top: calc(50% + 3px); left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 42px; height: 33px; background-image: url(../images/footer/icon_fleecoll.png); background-size: contain; background-repeat: no-repeat; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_txt { font-weight: bold; font-size: 16px; line-height: 1.4; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_txt span { display: block; font-size: 15px; font-weight: normal; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap { font-size: 13px; color: #758867; border: 1px solid #758867; padding: 5px 55px; margin-top: 40px; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap span:first-child { margin-right: 30px; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap span br { display: none; } footer#re-footer .re-footer_contact .re-footer_contact_inner .re-pagetop { position: absolute; bottom: -30px; right: 0; width: 5%; max-width: 60px; z-index: 998; } footer#re-footer .re-footer_contact .re-footer_contact_inner .re-pagetop a:hover { opacity: 0.7; } footer#re-footer .re-footer_contents { width: 95%; max-width: 1280px; margin: auto; padding: 105px 0 0; display: flex; align-items: flex-start; } footer#re-footer .re-footer_contents .left-column { width: calc(100% - 280px); } footer#re-footer .re-footer_contents .left-column > ul { display: flex; align-items: flex-start; flex-wrap: wrap; } footer#re-footer .re-footer_contents .left-column > ul > li { width: 31.333%; margin: 0 1.5% 110px; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) { width: 62.666%; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul { position: relative; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(7), footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(8), footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(9) { position: absolute; top: 0; left: 54.8%; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(8) { top: calc(1em + 20.5px); } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(9) { top: calc(2em + 41px); } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(3n) { margin-right: 0; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(3n+1) { margin-left: 0; } footer#re-footer .re-footer_contents .left-column > ul > li h5 { font-size: 20px; margin-bottom: 35px; } footer#re-footer .re-footer_contents .left-column > ul > li ul li { font-size: 14px; position: relative; padding-left: 1em; line-height: 1.4; margin-bottom: 15px; } footer#re-footer .re-footer_contents .left-column > ul > li ul li:last-child { margin-bottom: 0; } footer#re-footer .re-footer_contents .left-column > ul > li ul li:before { content: "-"; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); } footer#re-footer .re-footer_contents .right-column > ul > li h5 { font-size: 20px; margin-bottom: 20px; } footer#re-footer .re-footer_contents .right-column > ul > li ul { display: flex; align-items: center; } footer#re-footer .re-footer_contents .right-column > ul > li ul li:first-child { max-width: 31px; margin: 0 50px 0 25px; } footer#re-footer .re-footer_contents .right-column > ul > li ul li:last-child { max-width: 33px; } footer#re-footer .re-footer_contents .right-column > ul > li p { width: 100%; max-width: 280px; } footer#re-footer .re-footer_contents .right-column > ul > li p a, footer#re-footer .re-footer_contents .right-column > ul > li p img { display: block; } footer#re-footer .re-footer_contents .right-column > ul > li p a:hover { opacity: 0.7; } footer#re-footer .re-footer_contents .right-column > ul > li p img:first-child { display: block; } footer#re-footer .re-footer_contents .right-column > ul > li p img:last-child { display: none; } footer#re-footer .re-copy_box { width: 95%; max-width: 1280px; margin: auto; text-align: center; padding-bottom: 55px; } footer#re-footer .re-copy_box p:first-child { width: 100%; max-width: 156px; margin: auto; } footer#re-footer .re-copy_box p:last-child { border-top: 1px solid #9D9D9D; padding-top: 30px; margin-top: 30px; font-size: 14px; font-weight: bold; } @media screen and (max-width: 767px) { footer#re-footer .re-footer_contact .re-footer_contact_inner { width: 80%; max-width: none; display: block; padding: 16% 0 20%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column { width: 100%; max-width: none; margin-right: 0; margin-bottom: 16%; text-align: center; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column h2 { font-size: 5.4vw; margin-bottom: 7%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column a { display: inline-block; font-size: 4vw; border-radius: 30px; padding: 3% 12% 3% 6%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .left-column a:after { width: 5vw; height: 3vw; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column { width: 100%; margin-left: 0; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul { display: block; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li { text-align: center; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li:first-child { border-bottom: 1px solid #C4CCBE; border-right: none; padding-right: 0; margin-bottom: 12%; padding-bottom: 8.4%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li:last-child { padding-left: 0; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_head { font-size: 4.2vw; padding-left: calc(4.3vw + 3%); display: inline-block; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_head:before { top: 50%; width: 4.3vw; height: 4.6vw; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel { font-size: 10.4vw; margin: 7.5% auto 5.5%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel a { padding-left: calc(9.8vw + 4%); } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_tel a:before { width: 9.8vw; height: 7.6vw; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_txt { font-size: 4.2vw; line-height: 1.8; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column ul li .re-footer_contact_txt span { font-size: 3.8vw; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap { font-size: 3.2vw; padding: 4% 8%; line-height: 1.8; margin-top: 12%; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap span { display: block; text-indent: -1em; padding-left: 1em; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap span:first-child { margin-right: 0; } footer#re-footer .re-footer_contact .re-footer_contact_inner .right-column .re-footer_contact_cap span br { display: block; } footer#re-footer .re-footer_contact .re-footer_contact_inner .re-pagetop { bottom: -4%; right: auto; left: 50%; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); width: 20%; max-width: none; } footer#re-footer .re-footer_contents { width: 90%; max-width: none; padding: 20% 0 0; display: block; } footer#re-footer .re-footer_contents .left-column { width: 100%; } footer#re-footer .re-footer_contents .left-column > ul > li { width: 100%; margin: 0 0 5%; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) { width: 100%; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul { position: static; } footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(7), footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(8), footer#re-footer .re-footer_contents .left-column > ul > li:nth-child(4) ul li:nth-child(9) { position: relative; top: auto; left: auto; } footer#re-footer .re-footer_contents .left-column > ul > li.footer_list_active h5:after { background-image: url(../images/footer/icon-close.png); } footer#re-footer .re-footer_contents .left-column > ul > li h5 { font-size: 4.8vw; border-bottom: 1px solid #D6D6D6; margin-bottom: 0; padding-bottom: 5%; position: relative; } footer#re-footer .re-footer_contents .left-column > ul > li h5:after { content: ""; position: absolute; top: calc(50% - 1.6vw); right: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 4vw; height: 3.2vw; background-image: url(../images/footer/icon-open.png); background-size: contain; background-repeat: no-repeat; } footer#re-footer .re-footer_contents .left-column > ul > li ul { display: none; margin-bottom: 15%; } footer#re-footer .re-footer_contents .left-column > ul > li ul li { font-size: 3.6vw; margin-bottom: 3%; padding: 3% 0 2% 1em; border-bottom: 1px solid #D6D6D6; margin-left: 2em; } footer#re-footer .re-footer_contents .left-column > ul > li ul li:first-child { margin-top: 3%; } footer#re-footer .re-footer_contents .right-column { margin: 10% auto 28%; } footer#re-footer .re-footer_contents .right-column > ul > li { text-align: center; } footer#re-footer .re-footer_contents .right-column > ul > li:first-child { margin-bottom: 18%; height: auto !important; } footer#re-footer .re-footer_contents .right-column > ul > li h5 { font-size: 4.8vw; margin-bottom: 6%; } footer#re-footer .re-footer_contents .right-column > ul > li ul { justify-content: center; } footer#re-footer .re-footer_contents .right-column > ul > li ul li:first-child { width: 10%; max-width: none; margin: 0 15% 0 0; } footer#re-footer .re-footer_contents .right-column > ul > li ul li:last-child { width: 10%; max-width: none; } footer#re-footer .re-footer_contents .right-column > ul > li p { width: 83%; max-width: none; margin: auto; } footer#re-footer .re-footer_contents .right-column > ul > li p img:first-child { display: none; } footer#re-footer .re-footer_contents .right-column > ul > li p img:last-child { display: block; } footer#re-footer .re-copy_box { width: 100%; max-width: none; padding-bottom: 9%; } footer#re-footer .re-copy_box p:first-child { width: 35%; max-width: none; } footer#re-footer .re-copy_box p:last-child { padding-top: 5%; margin-top: 5%; font-size: 3.8vw; } } .slide-animation { animation: fadeleft 1500ms forwards; } @-webkit-keyframes fadeleft { 0% { transform: translateX(-50px); } 100% { transform: translateX(0); } } @keyframes fadeleft { 0% { transform: translateX(-50px); } 100% { transform: translateX(0); } } .slick-initialized .slick-slide { margin: 0; } #re-mv { position: relative; } #re-mv h1 { position: absolute; width: 48%; max-width: 907px; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 2; } #re-mv ul { background-color: #000; } #re-mv ul li img { display: block; } @media screen and (max-width: 767px) { #re-mv h1 { width: 60%; max-width: none; top: 40%; } } .re-heading { text-align: center; font-weight: 700; } .re-heading h3 { position: relative; font-size: 36px; margin: 0 auto; width: 100%; max-width: 280px; padding-bottom: 14px; margin-bottom: 41px; } @media screen and (max-width: 767px) { .re-heading h3 { font-size: 5.9vw; padding-bottom: 4%; margin-bottom: 7%; max-width: 50%; } } .re-heading h3::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; border-bottom: 1px solid #EA5521; } .re-heading h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 50%; border-bottom: 1px solid #00A33E; } .re-heading h4 { font-size: 43px; margin-bottom: 41px; } @media screen and (max-width: 767px) { .re-heading h4 { font-size: 6.8vw; margin-bottom: 6%; } } .re-heading p { font-size: 18px; line-height: 44px; } @media screen and (max-width: 767px) { .re-heading p { font-size: 4vw; line-height: 1.8; } } .re-heading-bold { text-align: center; font-weight: 700; } .re-heading-bold h3 { position: relative; font-size: 36px; margin: 0 auto; width: 100%; max-width: 280px; padding-bottom: 14px; margin-bottom: 41px; text-align: center; } @media screen and (max-width: 767px) { .re-heading-bold h3 { font-size: 5.9vw; padding-bottom: 4%; margin-bottom: 7%; max-width: 50%; } } .re-heading-bold h3::before { content: ""; position: absolute; left: 0; bottom: 0; width: 100%; border-bottom: 2px solid #EA5521; } .re-heading-bold h3::after { content: ""; position: absolute; left: 0; bottom: 0; width: 50%; border-bottom: 2px solid #00A33E; } .re-heading-bold h4 { font-size: 43px; margin-bottom: 41px; } @media screen and (max-width: 767px) { .re-heading-bold h4 { font-size: 6.8vw; margin-bottom: 6%; line-height: 1.5; } } .re-heading-bold p { font-size: 18px; line-height: 44px; } @media screen and (max-width: 767px) { .re-heading-bold p { font-size: 4vw; line-height: 1.8; } } #re-news { background-color: #fff; margin: -10% auto 0; width: 95%; max-width: 1280px; box-shadow: 0px 3px 6px -2px #c9c9c9; border: solid 1px #DEDEDE; padding: 65px 77px 60px 106px; display: flex; position: relative; } @media screen and (max-width: 767px) { #re-news { width: 90%; padding: 6% 8%; margin: -42% auto 0; display: block; position: relative; } } #re-news::before { content: ""; display: inline-block; position: absolute; top: 71.5px; left: 1px; width: 8vw; height: 2.7vw; background-image: url(../images/top/news_line.png); background-repeat: no-repeat; } @media screen and (max-width: 767px) { #re-news::before { top: 8.1vw; width: 8.1vw; height: 3.9vw; background-size: cover; } } @media screen and (max-width: 767px) { #re-news .re-leftcolumn { padding-left: 6%; } } #re-news .re-leftcolumn h2 { font-size: 30px; } @media screen and (max-width: 767px) { #re-news .re-leftcolumn h2 { display: inline-block; margin-bottom: 6%; font-size: 6.4vw; } } #re-news .re-leftcolumn p { font-size: 24px; margin-top: 10px; } @media screen and (max-width: 767px) { #re-news .re-leftcolumn p { display: inline-block; font-size: 4.2vw; margin-left: 3.3%; } } #re-news .re-leftcolumn a { font-size: 15px; margin-top: 64px; border: 1px solid black; border-radius: 36px; width: 183px; height: 45px; padding: 13px 21px; display: inline-block; position: relative; } @media screen and (max-width: 767px) { #re-news .re-leftcolumn a { display: flex; align-items: center; justify-content: center; position: absolute; bottom: 5%; left: 50%; margin-top: 0; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); font-size: 3.6vw; width: 53.7%; height: 7.7%; padding: 1.7% 5%; } } #re-news .re-leftcolumn a::after { content: ""; position: absolute; top: 34%; right: 20px; width: 16px; height: 8px; background-image: url(../images/top/btn.png); background-size: contain; background-repeat: no-repeat; } @media screen and (max-width: 767px) { #re-news .re-leftcolumn a::after { top: 50%; right: 2.8vw; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 4.6vw; height: 2.8vw; } } #re-news .re-rightcolumn { width: 80%; margin-left: 46px; } @media screen and (max-width: 767px) { #re-news .re-rightcolumn { padding-bottom: 20%; margin-left: 0; width: 100%; } } #re-news .re-rightcolumn ul li { border-bottom: 1px solid #B1B1B1; margin: 24px 0 22px; } @media screen and (max-width: 767px) { #re-news .re-rightcolumn ul li { margin: 6% 0 0; } } #re-news .re-rightcolumn ul li:first-child { margin-top: 0; } #re-news .re-rightcolumn ul li:last-child { margin-bottom: 0; } #re-news .re-rightcolumn ul li a { display: flex; margin-bottom: 21px; margin-top: 24px; align-items: center; } @media screen and (max-width: 900px) { #re-news .re-rightcolumn ul li a { display: block; } } @media screen and (max-width: 767px) { #re-news .re-rightcolumn ul li a { margin-bottom: 5%; margin-top: 8%; } } #re-news .re-rightcolumn ul li a:first-child { margin-top: 0; } #re-news .re-rightcolumn ul li a p { font-size: 16px; line-height: 1.6; } @media screen and (max-width: 767px) { #re-news .re-rightcolumn ul li a p { font-size: 3.6vw; margin-top: 3%; } } @media screen and (max-width: 900px) { #re-news .re-rightcolumn ul li a .day { display: inline-block; font-size: 3.2vw; } } #re-news .re-rightcolumn ul li a .re-rabel { font-size: 14px; background-color: #E3E3E3; padding: 4px 32px; margin: 0 14px; max-width: 120px; white-space: nowrap; } @media screen and (max-width: 900px) { #re-news .re-rightcolumn ul li a .re-rabel { display: inline-block; padding: 1.8% 7%; margin: 0 3%; font-size: 2.4vw; white-space: normal; max-width: none; } } #re-news .re-rightcolumn ul li a .re-rabel.re-tag-pressrelease { color: #fff; background-color: #EA5504; } #re-news .re-rightcolumn ul li a .re-rabel.re-tag-kinrei-news { color: #fff; background-color: #00A33E; } #re-news .re-rightcolumn ul li a .re-rabel.re-tag-cat75 { color: #fff; background-color: #000000; } #re-news .re-rightcolumn ul li a .re-longrabel { font-size: 14px; background-color: #E3E3E3; padding: 4px 10px; margin: 0 14px; max-width: 120px; white-space: nowrap; } @media screen and (max-width: 900px) { #re-news .re-rightcolumn ul li a .re-longrabel { display: inline-block; padding: 1.8% 2%; font-size: 2.4vw; margin: 0 3%; white-space: normal; max-width: none; } } #re-news .re-rightcolumn ul li a .re-longrabel.re-tag-pressrelease { color: #fff; background-color: #EA5504; } #re-news .re-rightcolumn ul li a .re-longrabel.re-tag-kinrei-news { color: #fff; background-color: #00A33E; } #re-news .re-rightcolumn ul li a .re-longrabel.re-tag-cat75 { color: #fff; background-color: #000000; } #re-about { margin: auto; width: 95%; max-width: 1522px; margin-top: 75px; margin-bottom: 388px; position: relative; } @media screen and (max-width: 1620px) { #re-about { margin-bottom: 24vw; } } @media screen and (max-width: 767px) { #re-about { width: 90%; margin-top: 59%; margin-bottom: 99%; } } #re-about .re-heading-bold { text-align: center; } #re-about .re-heading-bold:nth-child(2) { margin-top: 110px; } #re-about .re-heading-bold:nth-child(3) { margin-top: 152px; } @media screen and (max-width: 767px) { #re-about .re-heading-bold:nth-child(2) { margin-top: 76%; } #re-about .re-heading-bold:nth-child(3) { margin-top: 108%; } } #re-about .re-backillust img { position: absolute; top: 56%; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); z-index: -1; opacity: 0; -webkit-transition: opacity 1s; transition: opacity 1s; } #re-about .re-backillust img:nth-child(1), #re-about .re-backillust img:nth-child(2) { opacity: 1; } @media screen and (max-width: 767px) { #re-about .re-backillust img { top: -22%; left: -5.5%; -webkit-transform: none; transform: none; width: 111.11%; max-width: none; } } #re-about .re-sp-only { display: none; } @media screen and (max-width: 767px) { #re-about .re-pc-only { display: none; } #re-about .re-sp-only { display: block; } } .re-picslide { margin-bottom: 160px; } @media screen and (max-width: 767px) { .re-picslide { margin-bottom: 21%; } } #re-fan { width: 95%; max-width: 1278px; margin: auto; } @media screen and (max-width: 767px) { #re-fan { width: 100%; } } #re-fan .re-heading { margin-bottom: 67px; } @media screen and (max-width: 767px) { #re-fan .re-heading { margin-bottom: 9%; } } #re-fan ul { display: flex; margin: 0 auto; justify-content: space-between; max-width: 1278px; } @media screen and (max-width: 767px) { #re-fan ul { display: block; } #re-fan ul .slick-list { padding-left: calc(5% - 10px) !important; } } #re-fan ul li { border: solid 1px #DEDEDE; border-radius: 20px; width: 32%; max-width: 412px; } @media screen and (max-width: 767px) { #re-fan ul li { max-width: none; margin: 0 10px; } } #re-fan ul li a img { border-radius: 20px 20px 0px 0px; } #re-fan ul li a .re-fantext { position: relative; padding: 21px 30px 24px; } #re-fan ul li a .re-fantext::after { content: ""; position: absolute; bottom: 24px; right: 20px; width: 16px; height: 8px; background-image: url(../images/top/btn.png); background-size: contain; background-repeat: no-repeat; } @media screen and (max-width: 767px) { #re-fan ul li a .re-fantext::after { width: 5vw; height: 3vw; } } @media screen and (max-width: 767px) { #re-fan ul li a .re-fantext { padding: 6% 7%; } } #re-fan ul li a .re-fantext p { font-weight: 600; font-size: 16px; line-height: 26px; margin-bottom: 33px; } @media screen and (max-width: 767px) { #re-fan ul li a .re-fantext p { font-size: 3.8vw; line-height: 1.5; margin-bottom: 15%; } } #re-fan ul li a .re-fantext span { font-size: 14px; color: #9D9D9D; } @media screen and (max-width: 767px) { #re-fan ul li a .re-fantext span { font-size: 3.4vw; } } #re-fan .re-btn { margin: 60px auto 0; width: 80%; max-width: 720px; } @media screen and (max-width: 767px) { #re-fan .re-btn { margin: 8% auto 0; width: 90%; } } #re-fan .re-btn a { margin: auto; max-width: 720px; width: 100%; border: solid 1px #DEDEDE; box-shadow: 0px 4px 1px 0px #d1d1d1; background-color: #fff; padding: 49px 0 40px 0; } @media screen and (max-width: 767px) { #re-fan .re-btn a { padding: 8% 0 7% 0; text-align: center; } } #re-fan .re-btn a p { text-align: center; width: 64%; margin: 0 auto; font-size: 20px; padding: 22px 40px; background-color: black; color: #fff; max-width: 446px; position: relative; } @media screen and (max-width: 767px) { #re-fan .re-btn a p { width: 90%; max-width: none; font-size: 3.6vw; padding: 4% 0; } } #re-fan .re-btn a p::after { content: ""; position: absolute; bottom: 24px; right: 50px; width: 16px; height: 16px; background-image: url(../images/top/icon_gaibu_white.png); background-size: contain; background-repeat: no-repeat; } @media screen and (max-width: 767px) { #re-fan .re-btn a p::after { bottom: auto; top: 46%; right: 6vw; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); height: 4vw; width: 4vw; } } #re-fan .re-btn a div { margin: 20px auto 0; font-size: 20px; position: relative; max-width: 245px; } @media screen and (max-width: 767px) { #re-fan .re-btn a div { margin: 6% auto 0; font-size: 4vw; display: inline-block; max-width: none; padding-right: 20vw; } } #re-fan .re-btn a div::after { content: ""; position: absolute; bottom: -4px; width: 84px; height: 30px; background-image: url(../images/top/logo_fando.png); background-size: contain; background-repeat: no-repeat; } @media screen and (max-width: 767px) { #re-fan .re-btn a div::after { bottom: -1vw; width: 18vw; height: 6.5vw; right: 0; } } #re-fan .re-btn p { text-align: center; font-size: 14px; color: #666666; margin-top: 21px; } @media screen and (max-width: 767px) { #re-fan .re-btn p { font-size: 3.8vw; margin-top: 6%; } } #re-voice { width: 95%; max-width: 1278px; margin: 115px auto 0; } #re-voice .re-heading { margin-bottom: 67px; } #re-voice ul { margin: 0 auto; display: flex; justify-content: space-between; max-width: 1278px; } #re-voice ul li { width: 32%; max-width: 412px; } #re-voice ul li a .re-voice-box { margin-top: 55px; padding: 60px 40px 10px 35px; width: 412px; min-height: 462px; border: 1px solid #D6D6D6; border-radius: 20px; position: relative; } #re-voice ul li a .re-voice-box:before { content: ""; width: 108px; height: 108px; display: block; position: absolute; top: -55px; left: calc(50% - 54px); } #re-voice ul li a h3 { margin-bottom: 25px; padding-bottom: 17px; border-bottom: 1px solid #D6D6D6; font-size: 18px; font-weight: 600; line-height: 1; } #re-voice ul li a p { font-size: 18px; font-weight: 300; line-height: calc(28 / 18); } #re-voice ul li a p:not(:last-of-type) { margin-bottom: 30px; } #re-voice .re-voice-box.unknown:before { background: url(../images/top/voice_unknown.png) 0 0 /contain no-repeat; } #re-voice .re-voice-box.man:before { background: url(../images/top/voice_man.png) 0 0 /contain no-repeat; } #re-voice .re-voice-box.woman:before { background: url(../images/top/voice_woman.png) 0 0 /contain no-repeat; } #re-voice .re-btn { margin: 60px auto 0; width: 80%; max-width: 720px; } #re-voice .re-btn a { margin: auto; max-width: 720px; width: 100%; border: solid 1px #DEDEDE; box-shadow: 0px 4px 1px 0px #d1d1d1; background-color: #fff; padding: 49px 0 40px 0; } #re-voice .re-btn a p { text-align: center; width: 64%; margin: 0 auto; font-size: 20px; padding: 22px 40px; background-color: black; color: #fff; max-width: 446px; position: relative; } #re-voice .re-btn a div { margin: 20px auto 0; font-size: 20px; position: relative; max-width: 245px; } #re-voice .re-btn a div::after { content: ""; width: 107px; height: 21px; background-image: url(../images/top/logo_fanpos.png); background-size: contain; background-repeat: no-repeat; position: absolute; right: -10px; bottom: -1px; } #re-voice .re-btn p { text-align: center; font-size: 14px; color: #666666; margin-top: 21px; } @media screen and (min-width: 768px) { #re-voice ul li:not(:last-of-type) { margin-right: 18px; } } @media screen and (max-width: 767px) { #re-voice { margin: 22% auto 0; width: 100%; } #re-voice .re-heading { margin-bottom: 9%; } #re-voice ul { flex-direction: column; } #re-voice ul li { margin: 0 auto; max-width: none; width: calc(670 / 750 * 100vw); } #re-voice ul li:not(:last-of-type) { margin-bottom: calc(50 / 750 * 100vw); } #re-voice ul li a .re-voice-box { margin-top: calc(80 / 750 * 100vw); padding: calc(90 / 750 * 100vw) calc(60 / 750 * 100vw) calc(60 / 750 * 100vw); width: calc(670 / 750 * 100vw); min-height: calc(600 / 750 * 100vw); border: calc(2 / 750 * 100vw) solid #D6D6D6; border-radius: calc(30 / 750 * 100vw); } #re-voice ul li a .re-voice-box:before { width: 80px; height: 80px; top: -41px; left: calc(50% - 40px); } #re-voice ul li a h3 { margin: 0 calc(4 / 750 * 100vw) calc(50 / 750 * 100vw); padding-bottom: calc(30 / 750 * 100vw); border-bottom: calc(2 / 750 * 100vw) solid #D6D6D6; font-size: calc(36 / 750 * 100vw); } #re-voice ul li a p { font-size: calc(32 / 750 * 100vw); line-height: calc(28 / 16); } #re-voice ul li a p:not(:last-of-type) { margin-bottom: calc(50 / 750 * 100vw); } #re-voice .re-btn { margin: 8% auto 0; width: 90%; } #re-voice .re-btn a { padding: 8% 0 7% 0; text-align: center; } #re-voice .re-btn a p { width: 90%; max-width: none; font-size: 3.6vw; padding: 4% 0; } #re-voice .re-btn a div { margin: 6% auto 0; font-size: 4vw; display: inline-block; max-width: none; padding-right: 20vw; } #re-voice .re-btn a div::after { width: calc(180 / 750 * 100vw); height: calc(36 / 750 * 100vw); right: calc(-55 / 750 * 100vw); bottom: calc(-4 / 750 * 100vw); } #re-voice .re-btn p { font-size: 3.8vw; margin-top: 6%; } } #re-products { width: 95%; max-width: 1278px; margin: 160px auto 0; } @media screen and (max-width: 767px) { #re-products { width: 90%; margin: 22% auto 0; } } #re-products ul { display: flex; max-width: 1300px; margin: auto; justify-content: space-between; } @media screen and (max-width: 767px) { #re-products ul { display: block; } } #re-products ul li { max-width: 358px; width: 32%; margin: 0 15px; text-align: center; } @media screen and (max-width: 767px) { #re-products ul li { width: 90%; max-width: none; margin: 20% auto; } } #re-products ul li h2 { text-align: center; font-size: 30px; margin-top: 32px; } @media screen and (max-width: 767px) { #re-products ul li h2 { font-size: 6.7vw; margin-top: 2%; font-weight: bold; } } #re-products ul li p { text-align: center; margin: 51px auto 32px auto; font-size: 18px; line-height: 31px; letter-spacing: -0.05em; } @media screen and (max-width: 767px) { #re-products ul li p { font-size: 4vw; margin: 8% auto 6%; line-height: 1.8; } } #re-products ul li a { margin: auto; width: 100%; text-align: center; font-size: 15px; border: 1px solid black; border-radius: 36px; width: 183px; padding: 15px 21px; position: relative; } @media screen and (max-width: 767px) { #re-products ul li a { font-size: 3.8vw; width: 52%; padding: 3.6% 0; } } #re-products ul li a::after { content: ""; position: absolute; top: calc(50% - 1px); right: 20px; width: 16px; height: 8px; background-image: url(../images/top/btn.png); background-size: contain; background-repeat: no-repeat; transform: translate(0%, -50%); } @media screen and (max-width: 767px) { #re-products ul li a::after { right: 3.2vw; width: 4vw; height: 2vw; } } #re-products .re-btn { margin: 60px auto 0; width: 100%; max-width: 720px; } @media screen and (max-width: 767px) { #re-products .re-btn { text-align: center; } } #re-products .re-btn a { margin: auto; max-width: 720px; width: 100%; border: solid 1px #DEDEDE; box-shadow: 0px 4px 1px 0px #d1d1d1; background-color: #fff; padding: 49px 0 40px 0; } @media screen and (max-width: 767px) { #re-products .re-btn a { padding: 8% 0 7% 0; } } #re-products .re-btn a p { text-align: center; margin: 0 auto; font-size: 20px; padding: 22px 0; background-color: black; color: #fff; max-width: 446px; position: relative; } @media screen and (max-width: 767px) { #re-products .re-btn a p { width: 90%; max-width: none; font-size: 3.6vw; padding: 4% 0; } } #re-products .re-btn a div { margin: 20px auto 0; font-size: 20px; position: relative; max-width: 327px; } @media screen and (max-width: 767px) { #re-products .re-btn a div { margin: 6% auto 0; font-size: 4vw; text-align: center; max-width: none; } } #re-ourquality { margin: auto; margin-top: 162px; width: 95%; max-width: 1280px; } @media screen and (max-width: 767px) { #re-ourquality { width: 100%; margin-top: 15%; } } #re-ourquality .re-heading { margin-bottom: 80px; } @media screen and (max-width: 767px) { #re-ourquality .re-heading { margin: auto; margin-bottom: 13%; width: 90%; } } #re-ourquality ul { margin: auto; max-width: 1280px; } #re-ourquality ul li { margin: 12px; } @media screen and (max-width: 767px) { #re-ourquality ul { display: flex; justify-content: space-between; flex-wrap: wrap; max-width: 100%; } #re-ourquality ul li { width: 48%; margin: 0; margin-bottom: 4%; } #re-ourquality ul li:nth-child(2n) { margin-right: 0; } } @media screen and (max-width: 767px) { #re-ourquality .re-pc-only { display: none; } } #re-ourquality .re-sp-only { display: none; } @media screen and (max-width: 767px) { #re-ourquality .re-sp-only { display: block; } } #re-ourquality .re-options { margin-top: 98px; text-align: center; } #re-ourquality .re-options .re-dots { position: relative; display: inline-block; padding: 0 80px; } #re-ourquality .re-options .re-dots .slick-prev { width: 53px; height: 53px; background: url(../images/top/slide_btn.png) no-repeat 0 0; transform: none; background-size: contain; } #re-ourquality .re-options .re-dots .slick-next { width: 53px; height: 53px; background: url(../images/top/slide_btn.png) no-repeat 0 0; transform: scale(-1, 1); background-size: contain; } #re-ourquality .re-options .re-dots .slick-dots { position: static; } #re-ourquality .re-options .re-dots .slick-dots li { height: 0px; } #re-ourquality .re-options .re-dots .slick-dots li button { background: white; border: solid 1px #000; width: 10px; height: 10px; margin: auto; } #re-ourquality .re-options .re-dots .slick-dots li button::before { width: 10px; height: 10px; } #re-ourquality .re-options .re-dots .slick-dots .slick-active button { background: black; border: solid 1px #000; } @media screen and (max-width: 767px) { #re-ourquality .re-options { display: none; } } #re-instagram { margin: 165px auto 0; max-width: 1280px; text-align: center; } @media screen and (max-width: 767px) { #re-instagram { margin: 24% auto 0; } } #re-instagram .re-heading { width: 95%; margin: auto; } @media screen and (max-width: 767px) { #re-instagram .re-heading { width: 90%; } } #re-instagram .re-hushtag { width: 95%; margin: 77px auto 0; max-width: 931px; text-align: center; } @media screen and (max-width: 767px) { #re-instagram .re-hushtag { width: 90%; max-width: none; margin: 12% auto; } } #re-instagram .re-hushtag li { font-size: 20px; margin: 0 34px 30px; display: inline-block; } @media screen and (max-width: 767px) { #re-instagram .re-hushtag li { font-size: 5.3vw; font-weight: bold; margin: 0 4% 7%; } } #re-instagram .re-post { margin: auto; display: flex; flex-wrap: wrap; justify-content: space-between; } #re-instagram .re-post li { max-width: 302px; width: 23.5%; margin: 1%; } #re-instagram .re-post li:nth-child(4n+1) { margin-left: 0; } #re-instagram .re-post li:nth-child(4n) { margin-right: 0; } #re-instagram .re-post li a { position: relative; } #re-instagram .re-post li a:before { content: ""; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 31px; height: 32px; background-image: url(../images/top/icon_insta_w.png); background-size: contain; background-repeat: no-repeat; opacity: 0; -webkit-transition: all .3s; transition: all .3s; z-index: 2; } #re-instagram .re-post li a:after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: transparent; -webkit-transition: all .3s; transition: all .3s; } #re-instagram .re-post li a:hover { opacity: 1; } #re-instagram .re-post li a:hover:before { opacity: 1; } #re-instagram .re-post li a:hover:after { background-color: rgba(0, 0, 0, 0.4); } @media screen and (max-width: 767px) { #re-instagram .re-post { max-width: none; margin: auto; } #re-instagram .re-post li { max-width: none; width: 50%; margin: 0; display: block; line-height: 0; } #re-instagram .re-post li:nth-child(3n) { width: 100%; display: block; } #re-instagram .re-post li a { display: block; } #re-instagram .re-post li a img { width: 100%; } } #re-instagram .re-instagrambtn { text-align: center; font-size: 15px; border: 1px solid black; border-radius: 36px; width: 100%; height: 39px; padding: 10px 21px; display: block; text-align: center; margin: 90px auto 170px; max-width: 262px; position: relative; } #re-instagram .re-instagrambtn::before { content: ""; position: absolute; top: 31%; left: 40px; width: 24px; height: 14px; background-image: url(../images/top/icon_insta.png); background-size: contain; background-repeat: no-repeat; } #re-instagram .re-instagrambtn::after { content: ""; position: absolute; top: 31%; right: 40px; width: 24px; height: 14px; background-image: url(../images/top/icon_gaibu.png); background-size: contain; background-repeat: no-repeat; } @media screen and (max-width: 767px) { #re-instagram .re-instagrambtn { width: 59%; max-width: none; font-size: 3.8vw; height: auto; padding: 2.9% 0; margin: 10% auto 12%; } #re-instagram .re-instagrambtn::before { top: 55%; left: 10vw; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 4.4vw; height: 5vw; } #re-instagram .re-instagrambtn::after { top: 55%; right: 9vw; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 4.7vw; height: 5vw; } } #search-results { padding: 60px 0 0; width: 95%; max-width: 960px; margin: auto; } #search-results h2 { font-size: 30px; font-weight: bold; text-align: center; } #search-results .search-results-box { margin: 60px auto; text-align: center; } #search-results .search-results-box #search { width: 70%; max-width: 600px; text-align: left; font-size: 18px; font-weight: bold; padding: 20px 20px 10px 20px; border: none; border-bottom: 3px solid #CCC; } #search-results .search-results-box button { border: none; background: none; cursor: pointer; width: 100%; max-width: 34px; padding: 0; vertical-align: bottom; margin-left: 15px; } #search-results .search-results-box button:hover { opacity: 0.7; } #search-results h3 { margin-bottom: 60px; font-weight: bold; font-size: 30px; line-height: 1.5; text-align: center; position: relative; } #search-results h3 span { font-size: 16px; } #search-results .result_list li { padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid #9D9D9D; } #search-results .result_list li a { display: flex; align-items: center; } #search-results .result_list li a .search-image { max-width: 200px; } #search-results .result_list li a div { width: calc(100% - 200px); margin-left: 30px; line-height: 1.5; } #search-results .result_list li a div h4 { font-size: 22px; font-weight: bold; } #search-results .result_list li a div .re-search-txt { font-size: 16px; margin: 10px auto; } #search-results .result_list li a div .re-search-day { color: #999; font-size: 12px; } #search-results .content-nav { text-align: center; margin-top: 60px; } #search-results .content-nav span, #search-results .content-nav a { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; margin: 0 6px 12px; } #search-results .content-nav span { background-color: #F8F8F4; color: #758867; } #search-results .content-nav a { border: 1px solid #000; } #search-results .content-nav a.nav-prev, #search-results .content-nav a.nav-next { border: none; width: auto; } #search-results .content-nav a.nav-prev { margin-right: 10px; } #search-results .content-nav a.nav-next { margin-left: 10px; } @media screen and (max-width: 767px) { #search-results { padding: 12% 0; width: 90%; max-width: none; } #search-results h2 { font-size: 6.8vw; } #search-results .search-results-box { margin: 10% auto; } #search-results .search-results-box #search { max-width: none; font-size: 4vw; padding: 5%; } #search-results .search-results-box button { width: 10%; max-width: none; margin-left: 3%; } #search-results h3 { margin-bottom: 10%; font-size: 6.8vw; } #search-results h3 span { display: block; font-size: 4vw; } #search-results .result_list li { padding-bottom: 8%; margin-bottom: 8%; } #search-results .result_list li a .search-image { width: 40%; max-width: none; } #search-results .result_list li a div { width: 55%; margin-left: 5%; } #search-results .result_list li a div h4 { font-size: 4.6vw; } #search-results .result_list li a div .re-search-txt { font-size: 4vw; margin: 6% auto; } #search-results .result_list li a div .re-search-day { font-size: 3.4vw; } #search-results .content-nav { margin-top: 10%; } #search-results .content-nav span, #search-results .content-nav a { width: 9vw; height: 9vw; font-size: 4vw; margin: 0 2.5% 5%; } } .re-contact { width: 95%; max-width: 1080px; margin: auto; padding-bottom: 100px; font-weight: bold; } .re-contact .re-sp-only { display: none; } @media screen and (max-width: 767px) { .re-contact .re-pc-only { display: none; } .re-contact .re-sp-only { display: block; } } .re-contact .fontHira { font-weight: normal; } .re-contact .re-contact-num { display: flex; justify-content: center; margin-bottom: 70px; } .re-contact .re-contact-num li { width: 33.333%; position: relative; } .re-contact .re-contact-num li:before { content: ""; position: absolute; top: calc(50% - 1em); -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 150%; height: 4px; background-color: #c1c1c1; z-index: -1; } .re-contact .re-contact-num li:nth-child(1):before { content: none; } .re-contact .re-contact-num li:nth-child(2):before { left: -100%; } .re-contact .re-contact-num li:nth-child(2) span { margin: auto; } .re-contact .re-contact-num li:nth-child(3):before { right: 0%; } .re-contact .re-contact-num li:nth-child(3) span { margin: 0 0 0 auto; } .re-contact .re-contact-num li span { display: block; } .re-contact .re-contact-num li span:first-child { font-size: 30px; color: #fff; background-color: #c1c1c1; width: 60px; padding: 13px 0 17px; border-radius: 50%; display: flex; align-items: center; justify-content: center; } .re-contact .re-contact-num li span:last-child { font-size: 24px; width: 60px; text-align: center; margin-top: 10px; } .re-contact .re-contact-num li.num_active:before { background-color: #00a33e; } .re-contact .re-contact-num li.num_active span:first-child { background-color: #00a33e; } .re-contact .re-contact-num li.num_active span:last-child { color: #00a33e; } .re-contact h3 { font-size: 38px; position: relative; padding-left: 30px; font-weight: bold; margin-bottom: 60px; } .re-contact h3:before { content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 50%; background-color: #00A23E; } .re-contact h3:after { content: ""; position: absolute; bottom: 0; left: 0; width: 2px; height: 50%; background-color: #DA5E29; } .re-contact .form_anchor { display: none; } .re-contact .re-contact-note { padding: 50px; background-color: #f4f3ed; font-size: 20px; margin-bottom: 100px; } .re-contact .re-contact-note ul { margin-bottom: 50px; } .re-contact .re-contact-note ul li { margin-bottom: 15px; padding-left: 0.6em; text-indent: -1em; line-height: 1.4; } .re-contact .re-contact-note h4 { margin-bottom: 15px; font-size: 24px; } .re-contact .re-contact-note p { line-height: 1.4; } .re-contact .re-contact-note .re-btn { margin-top: 50px; text-align: right; } .re-contact .re-contact-note .re-btn a { display: inline-block; font-size: 16px; padding: 11px 49px 11px 30px; position: relative; border: 1px solid #000; border-radius: 25px; background-color: #fff; line-height: 1; } .re-contact .re-contact-note .re-btn a:after { content: ""; position: absolute; top: calc(50% - 1px); right: 20px; width: 16px; height: 8px; background-image: url(../images/top/btn.png); background-size: contain; background-repeat: no-repeat; transform: translate(0%, -50%); } .re-contact .re-contact-note .re-btn a:hover { opacity: 0.7; } .re-contact .re-contact-box .err_show { font-size: 28px; color: #cd2600; font-weight: bold; margin-bottom: 60px; text-align: center; } .re-contact .re-contact-box .re-contact-head { font-size: 20px; line-height: 2.2; } .re-contact .re-contact-box .re-contact-head span { font-size: 18px; color: #fff; background-color: #cd2600; padding: 11px 17px; display: inline-block; line-height: 1; margin-right: 20px; } .re-contact .re-contact-box form { margin-top: 70px; } .re-contact .re-contact-box form h4 { font-size: 28px; color: #00a23e; position: relative; margin-top: 100px; margin-bottom: 40px; padding-left: 1.5em; } .re-contact .re-contact-box form h4:before { content: ""; position: absolute; width: 1em; height: 1em; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); background-color: #00a23e; } .re-contact .re-contact-box form .input_box { margin-bottom: 50px; } .re-contact .re-contact-box form .input_box .re-contact-label { font-size: 24px; margin-bottom: 15px; } .re-contact .re-contact-box form .input_box .re-contact-sublabel { font-size: 20px; margin-bottom: 15px; font-weight: normal; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form .input_box p span { font-size: 18px; color: #fff; background-color: #cd2600; padding: 11px 17px; display: inline-block; line-height: 1; margin-left: 14px; } .re-contact .re-contact-box form .input_box input { width: 100%; font-size: 24px; padding: 15px; background-color: #f8f8f3; border: 1px solid #768767; font-weight: normal; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form .input_box input[type="number"]::-webkit-outer-spin-button, .re-contact .re-contact-box form .input_box input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; } .re-contact .re-contact-box form .input_box input[type="number"] { -moz-appearance: textfield; } .re-contact .re-contact-box form .input_box input[type="radio"] { display: none; } .re-contact .re-contact-box form .input_box.radio_box .re-contact-label { margin-bottom: 45px; } .re-contact .re-contact-box form .input_box.radio_box label { position: relative; margin-right: 40px; padding-left: 55px; font-size: 24px; color: #768767; font-weight: normal; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form .input_box.radio_box label:before { content: ''; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); background-color: #f8f8f3; border: 4px solid #768767; border-radius: 50%; display: block; width: 34px; height: 34px; } .re-contact .re-contact-box form .input_box.radio_box label:after { content: ''; position: absolute; top: 50%; left: 9px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); background: #768767; border-radius: 50%; display: block; opacity: 0; width: 24px; height: 24px; } .re-contact .re-contact-box form .input_box.radio_box input[type=radio]:checked + label::after { opacity: 1; } .re-contact .re-contact-box form .input_box textarea { width: 100%; height: 10em; line-height: 1.4; font-size: 24px; padding: 15px; background-color: #f8f8f3; border: 1px solid #768767; font-weight: normal; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form .input_box ::placeholder { color: rgba(118, 135, 103, 0.7); } .re-contact .re-contact-box form .input_box .error { background-color: #fbddd3; border: 1px solid #ea521c; } .re-contact .re-contact-box form .input_box select.error + .contact_select .custom-select-trigger { background-color: #fbddd3; border: 1px solid #ea521c; } .re-contact .re-contact-box form .input_box .err_msg { display: block; font-size: 20px; color: #cd2600; margin-top: 20px; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form .input_box .err_msg label { background-color: unset; border: none; } .re-contact .re-contact-box form .input_box .contact_select { position: relative; font-weight: normal; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form .input_box .contact_select.opened .custom-select-trigger { border-bottom: 1px solid #f8f8f3; } .re-contact .re-contact-box form .input_box .contact_select.opened .custom-select-trigger:before { content: ""; position: absolute; bottom: 0; left: 50%; -webkit-transform: translate(-50%, 0%); transform: translate(-50%, 0%); width: calc(100% - 40px); height: 1px; background-color: #768767; z-index: 2; } .re-contact .re-contact-box form .input_box .contact_select.opened .custom-select-trigger:after { -webkit-transform: translate(0%, -50%) rotate(-180deg); transform: translate(0%, -50%) rotate(-180deg); } .re-contact .re-contact-box form .input_box .contact_select.opened .custom-options { opacity: 1; visibility: visible; pointer-events: all; transform: translateY(0); z-index: 1; } .re-contact .re-contact-box form .input_box .contact_select .custom-select-trigger { position: relative; display: block; width: 100%; max-width: 440px; padding: 22px 20px; font-size: 24px; color: #768767; background-color: #f8f8f3; border: 1px solid #768767; cursor: pointer; } .re-contact .re-contact-box form .input_box .contact_select .custom-select-trigger:after { content: ""; position: absolute; top: 50%; right: 25px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 0; height: 0; border-style: solid; border-width: 15px 9px 0 9px; border-color: #768767 transparent transparent transparent; -webkit-transition: transform .3s; transition: transform .3s; } .re-contact .re-contact-box form .input_box .contact_select .custom-options { position: absolute; display: block; top: calc(100% - 1px); left: 0; right: 0; background-color: #f8f8f3; border: 1px solid #768767; transition: all .4s ease-in-out; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-15px); width: 100%; max-width: 440px; border-top: none; max-height: 420px; overflow-y: overlay; } .re-contact .re-contact-box form .input_box .contact_select .custom-options .custom-option { position: relative; display: block; padding: 22px 20px; font-size: 24px; color: #768767; cursor: pointer; transition: all .3s; } .re-contact .re-contact-box form .input_box .contact_select .custom-options .custom-option:hover { color: #fff; background-color: #768767; } .re-contact .re-contact-box form .input_box .re-contact-cap { font-size: 20px; margin-top: 15px; color: #768767; padding-left: 1em; text-indent: -1em; line-height: 1.4; } .re-contact .re-contact-box form .input_box .re-contact-cap a { color: #00a23e; border-bottom: 1px solid #00a23e; text-indent: 0; } .re-contact .re-contact-box form .input_box .re-contact-cap a:visited { color: #00a23e; } .re-contact .re-contact-box form .input_box .jan_img { max-width: 596px; } .re-contact .re-contact-box form .input_box .jan_img p { font-size: 20px; color: #768767; text-align: center; } .re-contact .re-contact-box form .input_box .jan_img p a { display: block; } .re-contact .re-contact-box form .input_box .jan_img p a:hover { opacity: 0.7; } .re-contact .re-contact-box form .col-2 { display: flex; align-items: flex-start; justify-content: space-between; } .re-contact .re-contact-box form .input-w-30 { width: 30%; max-width: 290px; } .re-contact .re-contact-box form .input-w-40 { width: 45%; max-width: 476px; } .re-contact .re-contact-box form .input-w-50 { width: 50%; max-width: 520px; } .re-contact .re-contact-box form .input-w-60 { width: 60%; max-width: 686px; } .re-contact .re-contact-box form .check_box { text-align: center; } .re-contact .re-contact-box form .check_box input[type=checkbox] { display: none; } .re-contact .re-contact-box form .check_box input[type=checkbox]:checked + label::after { opacity: 1; } .re-contact .re-contact-box form .check_box label { font-size: 24px; position: relative; padding-left: 40px; } .re-contact .re-contact-box form .check_box label:before { content: ''; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); height: 26px; width: 26px; background-color: #f8f8f3; border: 2px solid #768767; } .re-contact .re-contact-box form .check_box label:after { content: ''; position: absolute; top: 50%; left: 13px; transform: rotate(45deg); margin-top: -22px; opacity: 0; width: 9px; height: 25px; border-right: 5px solid #768767; border-bottom: 5px solid #768767; } .re-contact .re-contact-box form .check_box label a { color: #00a23e; border-bottom: 1px solid #00a23e; } .re-contact .re-contact-box form .check_box label a:visited { color: #00a23e; } .re-contact .re-contact-box form .check_box label span { font-size: 18px; color: #fff; background-color: #cd2600; padding: 11px 17px; display: inline-block; line-height: 1; margin-left: 14px; } .re-contact .re-contact-box form .btn-box { margin-top: 40px; } .re-contact .re-contact-box form .btn-box button { border: none; border-radius: 50px; width: 100%; display: block; background-color: #00a23e; color: #fff; padding: 32px 0 36px; font-size: 32px; position: relative; -webkit-transition: all .3s; transition: all .3s; } .re-contact .re-contact-box form .btn-box button:after { content: ""; position: absolute; top: 50%; right: 45px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 33px; height: 18px; background-image: url(../images/contact/btn_arrow.png); background-repeat: no-repeat; background-size: contain; } .re-contact .re-contact-box form .btn-box button:hover { opacity: 0.7; } .re-contact .re-contact-box form .btn-box p { position: relative; width: 100%; max-width: 240px; margin: 40px auto 0; } .re-contact .re-contact-box form .btn-box p:after { content: ""; position: absolute; top: calc(50% - 1px); right: 20px; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 16px; height: 8px; background-image: url(../images/top/btn.png); background-repeat: no-repeat; background-size: contain; } .re-contact .re-contact-box form .btn-box p input { width: 100%; display: block; font-size: 16px; padding: 11px 30px; border: 1px solid #000; border-radius: 25px; background-color: #fff; line-height: 1; -webkit-transition: all .3s; transition: all .3s; } .re-contact .re-contact-box form .btn-box p input:hover { opacity: 0.7; } .re-contact .re-contact-box form#form_conf { margin-top: 45px; } .re-contact .re-contact-box form#form_conf .input_box { word-break: break-all; border: 1px solid #cbcbcb; border-top: none; padding: 30px 20px; margin-bottom: 0; display: flex; align-items: center; line-height: 1.5; font-size: 20px; font-weight: normal; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .re-contact .re-contact-box form#form_conf .input_box:first-child { border-top: 1px solid #cbcbcb; } .re-contact .re-contact-box form#form_conf .input_box .re-contact-label { width: 34%; min-width: 34%; line-height: 1.5; margin-right: 50px; font-size: 20px; margin-bottom: 0; font-weight: bold; } .re-contact .re-contact-box form#form_conf .btn-box { display: flex; align-items: center; justify-content: space-between; margin-top: 60px; } .re-contact .re-contact-box form#form_conf .btn-box button:first-child { max-width: 360px; color: #000; border: 1px solid #000; background-color: #fff; font-size: 28px; padding: 33px 0 37px; } .re-contact .re-contact-box form#form_conf .btn-box button:first-child:after { left: 45px; right: auto; -webkit-transform: translate(0%, -50%) scale(-1, 1); transform: translate(0%, -50%) scale(-1, 1); width: 33px; height: 18px; background-image: url(../images/top/btn.png); } .re-contact .re-contact-box form#form_conf .btn-box button:last-child { max-width: 680px; } .re-contact .re-contact-box.re-thanks h3 { text-align: center; letter-spacing: 0.05em; } .re-contact .re-contact-box.re-thanks h3:before, .re-contact .re-contact-box.re-thanks h3:after { content: none; } .re-contact .re-contact-box.re-thanks .re-thanks-txt { text-align: center; margin: 0 auto 110px; font-size: 20px; } .re-contact .re-contact-box.re-thanks .re-btn { text-align: center; } .re-contact .re-contact-box.re-thanks .re-btn a { display: inline-block; font-size: 16px; padding: 11px 36px; position: relative; border: 1px solid #000; border-radius: 25px; background-color: #fff; line-height: 1; width: 100%; max-width: 240px; } .re-contact .re-contact-box.re-thanks .re-btn a:after { content: ""; position: absolute; top: calc(50% - 1px); right: 20px; width: 16px; height: 8px; background-image: url(../images/top/btn.png); background-size: contain; background-repeat: no-repeat; transform: translate(0%, -50%); } @media screen and (max-width: 767px) { .re-contact { width: 90%; max-width: none; padding-bottom: 14%; } .re-contact .re-contact-num { margin-bottom: 10%; } .re-contact .re-contact-num li:before { top: calc(50% - 4vw); } .re-contact .re-contact-num li span { display: block; } .re-contact .re-contact-num li span:first-child { font-size: 7vw; width: 15vw; padding: 3.5vw 0 4.5vw; } .re-contact .re-contact-num li span:last-child { font-size: 5vw; width: 3em; margin-top: 12%; } .re-contact h3 { font-size: 6.4vw; padding-left: 4%; margin-bottom: 10%; } .re-contact .form_anchor { display: block; text-align: center; margin-bottom: 10%; } .re-contact .form_anchor a { display: inline-block; position: relative; border: 1px solid #000; background-color: #fff; line-height: 1; width: 60%; font-size: 3.6vw; padding: 4vw 9vw; border-radius: 6vw; } .re-contact .form_anchor a:after { content: ""; position: absolute; top: 50%; right: 6vw; -webkit-transform: translate(0%, -50%); transform: translate(0%, -50%); width: 0; height: 0; border-style: solid; border-width: 2.5vw 1.5vw 0 1.5vw; border-color: #000 transparent transparent transparent; -webkit-transition: transform .3s; transition: transform .3s; } .re-contact .re-contact-note { padding: 7vw; font-size: 3.8vw; margin-bottom: 15%; } .re-contact .re-contact-note ul { margin-bottom: 12%; } .re-contact .re-contact-note ul li { margin-bottom: 8%; line-height: 1.5; } .re-contact .re-contact-note h4 { margin-bottom: 8%; font-size: 5.6vw; } .re-contact .re-contact-note p { line-height: 1.5; } .re-contact .re-contact-note .re-btn { margin-top: 12%; text-align: center; } .re-contact .re-contact-note .re-btn a { font-size: 3.6vw; padding: 4vw 14vw 4vw 6vw; border-radius: 6vw; } .re-contact .re-contact-note .re-btn a:after { right: 5vw; width: 3.6vw; height: 2vw; } .re-contact .re-contact-box .err_show { font-size: 5.6vw; line-height: 1.5; margin-bottom: 10%; } .re-contact .re-contact-box .re-contact-head { font-size: 4.2vw; line-height: 2.4; } .re-contact .re-contact-box .re-contact-head span { font-size: 3.8vw; padding: 2.6vw 4vw; margin-right: 3vw; } .re-contact .re-contact-box form { margin-top: 12%; } .re-contact .re-contact-box form h4 { font-size: 5.6vw; margin-top: 20%; margin-bottom: 8%; padding-left: 1.2em; } .re-contact .re-contact-box form h4:before { width: 0.8em; height: 0.8em; } .re-contact .re-contact-box form .input_box { margin-bottom: 12vw; } .re-contact .re-contact-box form .input_box .re-contact-label { font-size: 5.6vw; margin-bottom: 5%; line-height: 1.5; } .re-contact .re-contact-box form .input_box .re-contact-sublabel { font-size: 4.2vw; margin-bottom: 5%; } .re-contact .re-contact-box form .input_box p span { font-size: 3.8vw; padding: 2.6vw 4vw; margin-left: 3vw; } .re-contact .re-contact-box form .input_box input { font-size: 4.2vw; padding: 4vw; } .re-contact .re-contact-box form .input_box.radio_box .re-contact-label { margin-bottom: 8%; } .re-contact .re-contact-box form .input_box.radio_box label { display: block; margin-right: 0; margin-bottom: 8%; padding-left: 7vw; font-size: 4.8vw; } .re-contact .re-contact-box form .input_box.radio_box label:before { border: 2px solid #768767; width: 4vw; height: 4vw; } .re-contact .re-contact-box form .input_box.radio_box label:after { left: 1vw; width: 3vw; height: 3vw; } .re-contact .re-contact-box form .input_box textarea { line-height: 1.5; font-size: 4.2vw; padding: 4vw; height: 15em; } .re-contact .re-contact-box form .input_box .err_msg { font-size: 4.2vw; margin-top: 5%; } .re-contact .re-contact-box form .input_box .contact_select .custom-select-trigger { max-width: none; padding: 5.1vw 4vw; font-size: 4.2vw; } .re-contact .re-contact-box form .input_box .contact_select .custom-select-trigger:after { right: 6vw; border-width: 3.6vw 2vw 0 2vw; } .re-contact .re-contact-box form .input_box .contact_select .custom-options { max-width: none; max-height: 40vh; } .re-contact .re-contact-box form .input_box .contact_select .custom-options .custom-option { padding: 5.4vw 4vw; font-size: 4.2vw; } .re-contact .re-contact-box form .input_box .re-contact-cap { font-size: 3.8vw; margin-top: 5%; line-height: 1.5; } .re-contact .re-contact-box form .input_box .jan_img { max-width: none; margin-top: 5%; } .re-contact .re-contact-box form .input_box .jan_img p { font-size: 3.6vw; } .re-contact .re-contact-box form .col-2 { display: block; } .re-contact .re-contact-box form .input-w-30 { width: 100%; max-width: none; } .re-contact .re-contact-box form .input-w-40 { width: 100%; max-width: none; } .re-contact .re-contact-box form .input-w-50 { width: 100%; max-width: none; margin-bottom: 8%; } .re-contact .re-contact-box form .input-w-60 { width: 100%; max-width: none; } .re-contact .re-contact-box form .check_box label { font-size: 3.8vw; padding-left: 10vw; } .re-contact .re-contact-box form .check_box label:before { height: 5vw; width: 5vw; } .re-contact .re-contact-box form .check_box label:after { left: 2.8vw; margin-top: -4vw; width: 1.5vw; height: 4.5vw; } .re-contact .re-contact-box form .check_box label span { font-size: 3.8vw; padding: 2.6vw 4vw; margin-left: 3vw; } .re-contact .re-contact-box form .btn-box { margin-top: 15%; } .re-contact .re-contact-box form .btn-box button { border-radius: 9vw; padding: 6vw 0; font-size: 6vw; } .re-contact .re-contact-box form .btn-box button:after { right: 7vw; width: 6.9vw; height: 3.7vw; } .re-contact .re-contact-box form .btn-box p { width: 60%; max-width: none; margin: 12% auto 0; } .re-contact .re-contact-box form .btn-box p:after { right: 4vw; width: 4vw; height: 2.4vw; } .re-contact .re-contact-box form .btn-box p input { font-size: 4.2vw; padding: 4vw 7vw; border-radius: 7vw; } .re-contact .re-contact-box form#form_conf { margin-top: 10%; } .re-contact .re-contact-box form#form_conf .input_box { padding: 5%; display: block; font-size: 3.8vw; } .re-contact .re-contact-box form#form_conf .input_box .re-contact-label { width: 100%; min-width: unset; margin-right: 0; font-size: 3.8vw; border-bottom: 1px solid #cbcbcb; margin-bottom: 4%; padding-bottom: 2%; } .re-contact .re-contact-box form#form_conf .btn-box { justify-content: center; flex-wrap: wrap-reverse; margin-top: 12%; } .re-contact .re-contact-box form#form_conf .btn-box button { width: 100%; } .re-contact .re-contact-box form#form_conf .btn-box button:first-child { max-width: none; padding: 6vw 0; font-size: 6vw; width: 70%; margin-top: 12%; } .re-contact .re-contact-box form#form_conf .btn-box button:first-child:after { left: 7vw; width: 6.9vw; height: 3.7vw; } .re-contact .re-contact-box form#form_conf .btn-box button:last-child { max-width: none; } .re-contact .re-contact-box.re-thanks .re-thanks-txt { margin: 0 auto 20%; font-size: 4.2vw; } .re-contact .re-contact-box.re-thanks .re-btn a { font-size: 3.6vw; padding: 4vw 8vw; border-radius: 6vw; width: 63%; max-width: none; } .re-contact .re-contact-box.re-thanks .re-btn a:after { right: 5vw; width: 3.6vw; height: 2vw; } } #container { padding-bottom: 0; } html.re-html { font-size: 100%; font-family: "ShipporiMinchoB1", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; color: #000; } html.re-html body.re-body { background: none; font: inherit !important; color: #000; } @media screen and (max-width: 1450px) { html.re-html body.re-body { min-width: 1450px; } } @media screen and (max-width: 767px) { html.re-html body.re-body { min-width: unset; } } html.re-html body.re-body img { max-width: 100%; flex-shrink: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden; } html.re-html body.re-body a { text-decoration: none; color: #000; -webkit-transition: all .3s; transition: all .3s; display: inline-block; } html.re-html body.re-body a:visited { color: #000; } html.re-html body.re-body * { outline: none !important; } .fontEn { font-family: "EBGaramond", "ShipporiMinchoB1", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .fontHira { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .mfp-iframe-scaler { padding-top: 140%; } .mfp-iframe-holder .mfp-content { max-width: 560px; } .menu.archive-page .archive-area#udon, .menu.archive-page .archive-area#men, .menu.archive-page .archive-area#nabe { padding: 85px 0 0; margin-top: -35px; } .item .item-main-info { padding-top: 5px; } .re-blog-pickup li, .re-news-pickup li { display: none; } .re-under-title .re-topicpath { font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Meiryo, "メイリオ", "ＭＳ Ｐゴシック", Arial, Helvetica, sans-serif; } .grid-container { max-width: 1080px !important; } @media screen and (max-width: 767px) { .grid-container { width: 95%; max-width: none !important; } } .re-common-heading { font-size: 40px; position: relative; padding-left: 30px; margin-bottom: 30px; font-weight: bold; } .re-common-heading:before { content: ""; position: absolute; top: 0; left: 0; width: 2px; height: 50%; background-color: #00A23E; } .re-common-heading:after { content: ""; position: absolute; bottom: 0; left: 0; width: 2px; height: 50%; background-color: #DA5E29; } @media screen and (max-width: 767px) { .re-common-heading { font-size: 6.4vw; padding-left: 4%; } } .re-width-L { width: 100% !important; max-width: 316px !important; } @media screen and (max-width: 767px) { .re-width-L { max-width: 40% !important; } } .re-width-M { width: 100% !important; max-width: 275px !important; } @media screen and (max-width: 767px) { .re-width-M { max-width: 40% !important; } } .re-width-S { width: 100% !important; max-width: 265px !important; } @media screen and (max-width: 767px) { .re-width-S { max-width: 40% !important; } } .re-text-height { line-height: 1.4; } @media screen and (max-width: 767px) { .re-margin-0 { margin: 0 !important; } } .re-mt-0 { margin-top: 0 !important; } @media screen and (max-width: 767px) { .youtube_box { position: relative; width: 100%; padding-top: 56.25%; } .youtube_box iframe { position: absolute; top: 0; right: 0; width: 100%; height: 100%; } } @media screen and (max-width: 767px) { .otoriyose .kodawariArea .thumb01, .otoriyose .kodawariArea .thumb02, .otoriyose .kodawariArea .thumb03 { overflow: hidden; } } @media screen and (max-width: 767px) { .nowater #contents { overflow: hidden; } } .news-kokumen #re-newslist .re-maininner, .news-column #re-newslist .re-maininner, .news-kokumen-entry #re-newsdetail, .news-column-entry #re-newsdetail { justify-content: center; } #re-detail-method h3 { margin-bottom: 20px; } #re-detail-method .re-howto-order { margin-bottom: 50px; } #re-detail-method .re-howto-order .order-text { line-height: 1.4; font-size: 16px; } @media screen and (max-width: 767px) { #re-detail-method { margin-bottom: 10.5%; } #re-detail-method h3 { margin-bottom: 0; font-size: 6.5vw !important; } #re-detail-method .re-howto-order { margin-bottom: 10%; } #re-detail-method .re-howto-order .order-text { font-size: 4vw; } } .re-howto-box { display: flex; align-items: flex-start; justify-content: flex-start; flex-wrap: wrap; } .re-howto-box li { width: 25%; padding-top: 20px; padding-right: 50px; margin-bottom: 30px; background: url(../../img/howto/arrow_r.png) no-repeat 96% 120px; position: relative; } .re-howto-box li:before { content: ""; position: absolute; top: 0; left: 10px; width: 51px; height: 66px; background-size: contain; background-repeat: no-repeat; } .re-howto-box li:last-child { background: none; } .re-howto-box li:nth-child(1):before { background-image: url(../images/menu/howto_num1.png); } .re-howto-box li:nth-child(2):before { background-image: url(../images/menu/howto_num2.png); } .re-howto-box li:nth-child(3):before { background-image: url(../images/menu/howto_num3.png); } .re-howto-box li:nth-child(4):before { background-image: url(../images/menu/howto_num4.png); } .re-howto-box li:nth-child(5):before { background-image: url(../images/menu/howto_num5.png); } .re-howto-box li:nth-child(6):before { background-image: url(../images/menu/howto_num6.png); } .re-howto-box li:nth-child(7):before { background-image: url(../images/menu/howto_num7.png); } .re-howto-box li:nth-child(8):before { background-image: url(../images/menu/howto_num8.png); } .re-howto-box li .re-howto-img { padding: 10px; background-color: #fff; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3); display: inline-block; width: 100%; } .re-howto-box li .re-howto-img img { display: block; width: 100%; height: 162px; object-fit: cover; } .re-howto-box li .re-howto-txt-box p { line-height: 1.4; } .re-howto-box li .re-howto-txt-box p:first-child { background-color: #005e15; color: #fff; padding: 10px; font-size: 18px; font-weight: bold; display: flex; align-items: center; } .re-howto-box li .re-howto-txt-box p:last-child { font-size: 16px; margin-top: 10px; } @media screen and (max-width: 767px) { .re-howto-box { display: block; } .re-howto-box li { width: 80%; padding-top: 10%; padding-right: 0; margin: auto; padding-bottom: 15%; background: url(../../img/howto/arrow_b@2x.png) no-repeat 50% 100%; background-size: 20vw 9vw; } .re-howto-box li:before { top: 3%; left: 5%; width: 12vw; height: 15.6vw; } .re-howto-box li:last-child { padding-bottom: 0; } .re-howto-box li .re-howto-img { padding: 4%; width: 100%; } .re-howto-box li .re-howto-img img { height: 53.7vw; } .re-howto-box li .re-howto-txt-box p:first-child { padding: 4%; font-size: 4.6vw; } .re-howto-box li .re-howto-txt-box p:last-child { font-size: 4vw; margin-top: 4%; } } .re-banner { margin: 30px 0; } @media screen and (max-width: 767px) { .re-banner { margin: 8% 0; } .re-banner a, .re-banner img { display: block !important; } .re-banner img { width: 100%; } } header#re-header nav > ul.header_pc-only > li:last-child { margin-right: 0; } header#re-header.header_white, header#re-header.re-under { color: #000; } header#re-header.re-under nav > ul.header_pc-only > li p a, header#re-header:not(.header_white) nav > ul.header_pc-only > li .p-head_link a { color: #fff; } header#re-header.re-under nav > ul.header_pc-only > li p a, header#re-header.re-under nav > ul.header_pc-only > li .p-head_link a { color: #000; } header#re-header nav > ul.header_pc-only > li > p a { color: #fff; } header#re-header.header_white nav > ul.header_pc-only > li .p-head_link, header#re-header.re-under nav > ul.header_pc-only > li .p-head_link, header#re-header.header_white nav > ul.header_pc-only > li p a, header#re-header.re-under nav > ul.header_pc-only > li p a { color: #000; } header#re-header nav > ul.header_pc-only > li { margin: 0 15px; } header#re-header nav > ul.header_pc-only > li > p, header#re-header nav > ul.header_pc-only > li .p-head_link { font-size: 20px; } @media screen and (max-width: 1450px) { header#re-header nav > ul.header_pc-only > li { margin: 0 15px; } header#re-header nav > ul.header_pc-only > li > p, header#re-header nav > ul.header_pc-only > li .p-head_link { font-size: 18px; } } @media screen and (max-width: 1676px) { header#re-header nav > ul.header_pc-only > li { margin: 0 1.1vw; } header#re-header nav > ul.header_pc-only > li > p, header#re-header nav > ul.header_pc-only > li .p-head_link { font-size: 1.18vw; } }