@charset "UTF-8";
 html {
font-size: 62.5%;
}
body {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HG明朝E", "MS P明朝", "MS 明朝", serif;
position: relative;
}
html,
body {
width: 100%;
}
h1 {
font-size: 3.2rem;
}
h2 {
text-align: center;
line-height: 1.5;
font-size: 3rem;
font-weight: 500;
}
h4 {
font-size: 2rem;
color: #222;
text-align: center;
margin-bottom: 20px;
}
@media screen and (max-width: 896px) {
h2 {
font-size: 1.8rem;
}
}
h3 {
font-size: 1.8rem;
color: #222;
}
p {
line-height: 1.7;
font-size: 1.5rem;
color: #333;
}
p.image-text {
color: #888;
padding: 10px 0;
text-align: center;
}
p.image-text_white {
color: #fff;
padding: 10px 0;
text-align: center;
}
h2 span.subttl {
font-size: 18px;
}
ul li {
font-size: 1.4rem;
color: #333;
}
a {
color: #333;
text-decoration: none;
transition: all 0.3s;
}
a:hover {
opacity: 0.8;
}
a:hover > img {
opacity: 0.8;
}
img {
display: block;
width: 100%;
object-fit: cover;
}
@media screen and (max-width: 896px) {
img {
display: block;
max-width: 100%;
}
}
i.fa {
display: inline;
}
header {
display: block;
justify-content: space-between;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 3333;
}
.header {
position: fixed;
top: 0;
width: 100%;
background: rgba(0, 0, 0, 0.7);
transition: all 0.5s ease;
}
.hidden {
background: rgba(255, 255, 255, 0.8);
transition: all 0.5s ease;
}
@media screen and (max-width: 896px) {
header {
display: flex;
height: 60px;
}
}
header .logo_image { max-width: 1400px;
margin: 0 auto;
height: 80px;
}
@media screen and (max-width: 896px) {
header .logo_image {
text-align: center;
height: 60px;
}
}
header .logo_image img {
width: 200px;
height: auto;
display: inline;
padding-top: 8px;
}
header .logo_image .top {
position: relative;
}
header .logo_image .top a {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 9999;
}
@media screen and (max-width: 896px) {
header .logo_image img {
width: 140px;
margin-top: 0px;
}
header .logo_image .top {
position: static;
}
header .logo_image .top a {
position: static;
}
} nav {
position: absolute;
right: 0;
top: 0;
} .navbar_toggle {
z-index: 20;
}
.navbar_toggle_icon {
position: relative;
display: block;
height: 2px;
width: 52px;
background: #fff;
-webkit-transition: ease 0.5s;
transition: ease 0.5s;
}
@media screen and (max-width: 896px) {
.navbar_toggle_icon {
width: 30px;
}
}
.navbar_toggle_icon:nth-child(1) {
top: 0;
}
.navbar_toggle_icon:nth-child(2) {
margin: 14px 0;
}
.navbar_toggle_icon:nth-child(3) {
top: 0;
}
.navbar_toggle.open .navbar_toggle_icon:nth-child(1) {
top: 15px;
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.navbar_toggle.open .navbar_toggle_icon:nth-child(2) {
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
opacity: 0;
}
.navbar_toggle.open .navbar_toggle_icon:nth-child(3) {
top: -15px;
-webkit-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.menu_list {
-webkit-transform: translateY(-100%);
transform: translateY(-100%);
-webkit-transition: ease 0.5s;
transition: ease 0.5s;
z-index: 250;
width: 100%;
background: #fff;
position: absolute;
top: 0;
}
.menu_list li {
border-bottom: 1px solid #ccc;
font-size: 1.6rem;
}
.menu_list li a {
display: block;
padding: 30px;
}
@media screen and (max-width: 896px) {
.menu_list li a {
padding: 24px;
}
}
.menu_list.open {
-webkit-transform: translateY(0);
transform: translateY(0);
overflow-y: auto;
-webkit-overflow-scrolling: touch;
top: 100px;
}
@media screen and (max-width: 896px) {
.menu_list.open {
top: 60px;
}
} .container {
max-width: 1200px;
margin: 0 auto;
}
.br_sp {
display: none;
}
.br_pc {
display: block;
}
@media screen and (max-width: 896px) {
.container {
width: 94%;
}
.br_sp {
display: block;
}
.br_pc {
display: none;
}
}
a.a_link {
text-decoration: underline;
}
a.scroll_point {
height: 1px;
margin-top: -80px;
padding-top: 80px;
display: block;
}
@media screen and (max-width: 896px) {
a.scroll_point {
display: block;
margin-top: 0;
padding-top: 0;
}
}
h2.btm_border {
position: relative;
}
h2.btm_border:before,
h2.btm_border:after {
content: "";
position: absolute;
bottom: 0;
width: 51px;
height: 4px;
}
h2.btm_border:before {
left: 50%;
margin-left: -51px;
background: #b8bccc;
}
h2.btm_border:after {
right: 50%;
margin-right: -51px;
background: #0a184d;
}
h2.btm_stripe {
position: relative;
}
h2.btm_stripe:after {
position: absolute;
content: "";
bottom: 0;
right: 0;
left: 0;
margin: auto;
width: auto;
height: 8px;
background: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/stripe.png) no-repeat;
}
.mincho {
font-family: "游明朝", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HG明朝E", "MS P明朝", "MS 明朝", serif;
font-weight: 500;
line-height: 1.4;
letter-spacing: 0.1em;
}
h2.top {
font-size: 2.6rem;
margin: 45px 0 30px;
line-height: 1.4;
}
@media screen and (max-width: 896px) {
h2.top {
font-size: 2rem;
}
}
span.en {
letter-spacing: 0.1em;
font-family: "Yu Gothic UI", "游ゴシック", YuGothic, "ヒラギノゴシック Pro W3", "Hiragino Gothic Pro", "HGゴシックE", "MS Pゴシック", "MS ゴシック", sans-serif;
font-weight: normal;
font-size: 1.5rem;
color: #b8bccc;
}
span.tax_in {
font-size: 1.4rem;
color: #555;
}
.btn_orange {
text-align: center;
}
.btn_orange p {
text-align: center;
display: inline-block;
margin: 25px auto 0;
line-height: 1.5 !important;
}
.btn_orange p a {
color: #fff;
background: #0a184d;
border-radius: 24px;
padding: 12px 30px;
display: block;
transition: all 0.2s; }
.btn_link p a {
width: 200px;
color: #0a184d;
background: #fff;
border-radius: 24px;
padding: 12px 30px;
display: block;
transition: all 0.2s;
text-align: center;
margin: 0 auto;
}
.btn_link_color p a {
width: 200px;
padding: 10px 30px;
display: block;
transition: all 0.2s;
text-align: center;
margin: 0 auto;
border-radius: 27px;
border: #747b9b 1px solid;
}
.btn_link_color p a:hover {
background: #747b9b;
color: #fff;
}
.pad_80 {
padding: 80px 0;
}
.pl_25 {
padding-left: 25px;
}
.mt_20 {
margin-top: 20px;
}
.mt_30 {
margin-top: 30px;
}
.mt_40 {
margin-top: 40px;
}
.mt_50 {
margin-top: 50px;
}
.mt_60 {
margin-top: 60px;
}
.mt_80 {
margin-top: 80px;
}
.mt_120 {
margin-top: 120px;
}
.mb_20 {
margin-bottom: 20px;
}
.mb_25 {
margin-bottom: 25px;
}
.mb_30 {
margin-bottom: 30px;
}
.mb_40 {
margin-bottom: 40px;
}
.mb_60 {
margin-bottom: 60px;
}
.mb_80 {
margin-bottom: 80px;
}
.mb_120 {
margin-bottom: 120px;
}
.mb_200 {
margin-bottom: 200px;
}
.ta_c {
text-align: center;
}
.p_bld {
font-weight: bold;
line-height: 2;
}
@media screen and (max-width: 896px) {
.sp_mb_40 {
margin-bottom: 40px;
} .inr {
padding: 0 2%;
}
}  #resort-rg {
background: #1f212b;
padding: 10px 0 40px;
}
.rg_group h3 {
text-align: center;
font-size: 20px;
margin-bottom: 30px;
color: #fff;
}
.rg_group h3 span.en {
color: #fff;
}
.rg_group h4.rg_group {
color: #ccc;
font-size: 1.6rem;
text-align: left;
margin-bottom: 0;
}
.rg_group .box {
display: flex;
flex-direction: column;
}
.rg_group .box ul {
display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
}
@media screen and (max-width: 896px) {
.rg_group .box ul {
flex-direction: column;
}
}
.rg_group .box p.type {
text-align: center;
padding: 8px 0;
font-size: 1.8rem;
margin-bottom: 15px;
color: #fff;
}
.rg_group .box li {
display: flex;
margin-bottom: 32px;
margin-left: 8px;
width: 32%;
}
@media screen and (max-width: 896px) {
.rg_group .box li {
width: 100%;
margin-left: 0;
}
}
.rg_group .box li img {
width: 65px;
height: auto;
}
.rg_group .box li .txt {
padding: 5px 0 0 10px;
width: 100%;
}
.rg_group .box li .txt p {
font-size: 1.3rem;
line-height: 1.4;
margin-bottom: 5px;
color: #fff;
}
.rg_group .box li .txt h3 {
font-size: 1.6rem;
font-weight: 500;
line-height: 1.5;
color: #fff;
}
.rg_group .rg_details {
display: flex;
}
@media screen and (max-width: 896px) {
.rg_group .rg_details {
flex-direction: column;
}
}
.rg_group .rg_details dl {
float: left;
padding-right: 3%;
width: 32%;
font-size: 14px;
line-height: 1.5;
}
@media screen and (max-width: 896px) {
.rg_group .rg_details dl {
width: 100%;
}
}
.rg_group .rg_details dl:last-child {
padding-right: 0;
}
.rg_group .rg_details dt {
height: 1.6em;
font-weight: bold;
text-align: center;
padding: 20px 0 10px;
font-size: 16px;
text-decoration-line: underline;
color: #ccc;
}
.rg_group .rg_details dd {
color: #ccc;
}
@media screen and (max-width: 896px) {
.rg_group .rg_details dt {
text-align: left;
}
}
.rg_group .rg_details dd {
margin-left: 0px;
}
footer {
text-align: right;
padding: 140px 0 10px;
background: #060709; background-position: left;
background-repeat: no-repeat;
background-size: 500px;
}
footer a {
color: #fff;
}
footer .ftr_box {
justify-content: space-between;
}
footer .f_menu {
display: flex;
justify-content: center;
padding-bottom: 120px;
}
footer .f-logo .tel {
font-size: 20px;
}
footer .f-logo img {
max-width: 250px;
}
@media screen and (max-width: 896px) {
footer {
text-align: center;
padding: 130px 0 68px;
}
footer .ftr_box {
justify-content: center;
}
footer .f_menu {
flex-direction: column;
}
footer .f-logo {
margin-bottom: 24px;
}
footer .f-logo img {
margin: 0 auto 40px;
}
}
#footer-menu a {
color: #fff;
display: block;
}
#menu-item-891 {
display: block;
}
footer h2 {
font-size: 32px;
color: #fff;
}
footer p {
color: #fff;
text-align: left;
}
footer p.linkbar {
border: 1px solid;
width: 300px;
margin: 0 auto 30px;
}
footer p.linkbar a {
color: #fff;
padding: 10px;
display: block;
text-align: center;
}
#footer-menu ul {
max-width: 500px;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
@media screen and (max-width: 896px) {
footer h2 {
text-align: center;
}
footer p {
text-align: center;
}
#footer-menu ul li {
padding: 10px 20px;
margin-bottom: 10px;
}
}
footer .info {
margin-bottom: 50px;
}
footer .info .logo_image {
width: 304px;
}
@media screen and (max-width: 896px) {
footer .info .logo_image {
margin: 20px auto;
}
}
footer .info .logo_image img {
width: 304px;
}
footer .info p.tel {
font-size: 2.8rem;
}
footer .info p a {
color: #fff;
}
footer .info p.time {
font-size: 1.8rem;
}
footer .info .btn_orange a {
border-radius: 0;
padding: 12px 50px;
}
footer p.address {
margin-bottom: 20px;
}
footer a.recruit {
color: #b8bccc;
}
footer p.company {
font-size: 13px;
text-align: center;
}
.reserve_pc {
position: fixed;
bottom: 75px;
right: 0;
width: 200px;
height: 143px;
z-index: 100;
background: #fff;
color: #fff;
text-align: center;
}
@media screen and (max-width: 896px) {
.reserve_pc {
display: none;
}
}
.reserve_pc p {
background: #0a184d;
font-size: 2rem;
color: #fff;
margin-bottom: 7px;
padding-top: 5px;
}
.reserve_pc a {
font-size: 2rem;
color: #0a184d;
}
.reserve_pc a.to489 {
font-size: 1.6rem;
color: #fff;
margin-top: 7px;
}
.reserve_pc a.to489:hover {
text-decoration: underline;
}
.reserve_pc .reserve_to489 {
background: #0a184d;
padding: 10px 0;
margin-top: 7px;
}
.reserve_pc p span {
display: block;
font-size: 60%;
}
#footer_sp {
display: none;
}
@media screen and (max-width: 896px) {
#footer_sp {
display: block;
}
.reserve_sp {
width: 100%;
height: 60px;
display: flex;
position: fixed;
bottom: 0;
right: 0;
z-index: 100;
background: #0a184d;
color: #fff;
text-align: center;
}
.reserve_sp p {
padding-top: 10px;
text-align: center;
}
.reserve_sp p a {
color: #fff;
display: block;
}
.reserve_web,
.reserve_tel,
.reserve_btn {
width: 25%;
}
.reserve_web,
.reserve_tel,
.reserve_btn {
border-right: #fff solid 1px;
}
.reserve_btn:last-of-type {
border-right: none;
}
.reserve_btn {
background: #e6ebec;
}
.reserve_btn p a {
color: #1d1d1e;
} .check {
display: none;
} .menu-btn {
position: fixed;
display: block;
top: 12px;
right: 6%;
width: 50px;
height: 40px;
font-size: 10px;
text-align: center;
cursor: pointer;
z-index: 9999;
}
.bar {
position: absolute;
top: 0;
left: 0;
display: block;
width: 50px;
height: 3px;
background: #888; -webkit-transition: all 0.5s;
transition: all 0.5s;
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
}
.bar.middle {
top: 15px;
opacity: 1;
}
.bar.bottom {
top: 30px;
-webkit-transform-origin: left bottom;
-ms-transform-origin: left bottom;
transform-origin: left bottom;
}
.menu-btn:hover .bar {
background: #999;
}
.close-menu {
position: fixed;
top: 0;
right: 30%;
width: 100%;
height: 100vh;
background: rgba(0, 0, 0, 0);
-webkit-transition-property: all;
transition-property: all;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-delay: 0s;
transition-delay: 0s;
visibility: hidden;
opacity: 0;
}  .check:checked ~ .contents {
-webkit-transition-delay: 0s;
transition-delay: 0s;
-webkit-transform: translateX(-300px);
-ms-transform: translateX(-300px);
transform: translateX(-300px);
}
.check:checked ~ .menu-btn .bar.top {
width: 56px;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
}
.check:checked ~ .menu-btn .bar.middle {
opacity: 0;
}
.check:checked ~ .menu-btn .bar.bottom {
width: 56px;
top: 39px;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.check:checked ~ .close-menu {
-webkit-transition-duration: 1s;
transition-duration: 1s;
-webkit-transition-delay: 0.3s;
transition-delay: 0.3s;
background: rgba(0, 0, 0, 0.5);
visibility: visible;
opacity: 1;
z-index: 3;
}
}
.p-mb-contact {
background: #222;
display: flex;
justify-content: space-between;
position: fixed;
bottom: 0;
width: 100%;
z-index: 4;
}
.p-mb-contact a {
width: 50%;
height: 60px;
}
.p-mb-contact a.rsv {
background: #fff;
}
.p-mb-contact p {
color: #fff;
text-align: center;
padding-top: 18px;
}
.p-mb-contact a.rsv p {
color: #222;
} @media screen and (min-width: 897px) {
.p-mb-contact {
display: none;
} .menu {
max-width: 1200px;
float: right;
margin-right: 20px;
}
.menu-top-container {
max-width: 1200px;
margin: 0 auto;
}
#menu-item-891 {
display: none;
}
#menu-item-288 {
border: 1px solid #fff;
padding: 24px 60px 13px;
}
#menu-item-288:hover {
background: #fff;
}
#menu-item-288 a {
color: #fff;
}
#menu-item-288 a:hover {
color: #0a184d;
}
.menu-item {
display: inline-block;
padding: 20px 70px 10px;
text-align: center;
margin: 24px auto 0;
position: relative;
}
.menu-item a {
color: #fff;
display: block;
position: absolute;
top: 2px;
left: 0;
width: 100%;
height: 100%;
}
#menu-item-288 a {
top: 9px;
}
.check,
.menu-btn {
display: none;
}
} .pankuzu {
padding: 8px 0;
font-size: 1.3rem;
color: #333;
}
.wrapper {
overflow-x: hidden;
}
.page_top_view {
padding: 45px 0 60px;
width: 1200px;
max-width: 100%;
margin: 0 auto;
}
@media screen and (max-width: 896px) {
.pankuzu {
margin-top: 60px;
}
.page_top_view {
padding: 0 0 8%;
}
}
.page_top_view img {
width: 100%;
height: 400px;
object-fit: cover;
}
@media screen and (max-width: 896px) {
.page_top_view {
width: 100%;
}
.page_top_view img {
width: 100%;
height: 240px;
}
}
.page_top_view img.page_top {
margin: 0 auto 40px;
}
.page_top_view .ttl_area {
text-align: center;
}
.page_top_view .ttl_area h2 {
padding: 0 0 24px;
}
.page_top_view .ttl_area .en {
color: #444;
}
.page_top_view .ttl_area p.msg {
margin-top: 50px;
font-size: 1.6rem;
}
ul.room_slide li img {
margin-bottom: 15px;
}
ul.cate_btn {
margin: 45px 0 0;
display: flex;
justify-content: space-around;
}
ul.cate_btn li {
text-align: center;
}
ul.cate_btn li a {
background: #fff;
border: 1px solid #ccc;
padding: 18px 0 16px;
display: block;
}
ul.cate_btn li.btn_2 {
width: 346px;
}
ul.cate_btn li.btn_3 {
width: 310px;
}
ul.cate_btn li.btn_4 {
width: 240px;
}
h3.stripe {
position: relative;
text-align: center;
font-size: 2.6rem;
margin-bottom: 50px;
}
@media screen and (max-width: 896px) {
h3.stripe {
font-size: 2rem;
}
}
h3.stripe span {
padding: 0 25px;
position: relative;
z-index: 20;
}
@media screen and (max-width: 896px) {
h3.stripe span {
padding: 0 0;
}
}
h3.border {
color: #0a184d;
position: relative;
text-align: center;
font-size: 2.6rem;
margin-bottom: 20px;
}
@media screen and (max-width: 896px) {
h3.border {
font-size: 2rem;
}
}
h3.border span {
background: #f1f4f4;
padding: 0 25px;
position: relative;
z-index: 20;
}
h3.border:before {
content: "";
display: block;
position: absolute;
height: 8px;
width: 100%;
border-top: 1px solid #ccc;
top: 0;
bottom: 0;
margin: auto;
z-index: 10;
}
#group_plan {
padding: 80px 0;
}
ul.plan_list {
display: flex;
justify-content: space-between;
}
ul.plan_list li {
width: 100%;
}
.plan_item {
width: 478px;
margin-bottom: 50px;
}
.plan_item .photo {
position: relative;
}
.plan_item .photo img {
object-fit: cover;
width: 100%;
height: 240px;
}
.plan_item .photo p.plan_num {
background: #648bb8;
color: #fff;
font-size: 1.4rem;
padding: 4px 25px;
position: absolute;
bottom: 0;
left: 0;
}
.plan_item .txt {
background: #fff;
padding: 2% 4% 3%;
}
.plan_item .txt .ttl {
border-bottom: 1px solid #b8bccc;
padding: 10px 0 20px;
text-align: center;
}
.plan_item .txt .ttl h4 {
font-size: 2.4rem;
margin: 15px 0 0;
}
.plan_item .txt .sub p {
font-size: 1.4rem;
margin-top: 15px;
}
.plan_item .txt .sub p.gray {
background: #ededed;
padding: 2%;
}
.plan_item .txt .sub .btn_orange {
margin-top: 5px;
}
.plan_large {
width: 100%;
margin-bottom: 65px;
}
#check_place {
padding: 40px 0;
}
#check_place p.msg {
margin-bottom: 40px;
font-size: 1.6rem;
color: #222;
text-align: center;
}
#check_place p.caution {
color: #444;
text-align: center;
margin-bottom: 60px;
}
#without_meals {
padding: 80px 0;
}
.detail {
width: 776px;
margin: 0 auto;
}
.name {
display: flex;
margin-bottom: 30px;
}
.name p {
font-size: 1.6rem;
}
.name p.green {
background: #19a495;
border: 1px solid #19a495;
color: #fff;
width: 25%;
text-align: center;
padding: 25px 0;
}
.name p.white {
background: #fff;
border: 1px solid #999;
width: 75%;
padding: 25px;
box-sizing: border-box;
}
#with_meals {
padding: 80px 0;
}
#day_plan {
padding: 80px 0;
}
#option {
padding: 80px 0;
}
.plan_content p.msg {
text-align: center;
margin-bottom: 40px;
font-size: 1.6rem;
color: #222;
}
#menu .menu_detail {
width: 800px;
margin: 0 auto;
}
#menu .menu_detail .txt {
background: #fff;
padding: 5px;
}
#menu .menu_detail .inner {
border: 1px solid #a5c9c2;
padding: 30px 0;
}
#menu .menu_detail li {
text-align: center;
margin-bottom: 25px;
color: #222;
font-size: 1.6rem;
}
#menu .menu_detail p {
text-align: center;
}
.glamping_content p.msg {
text-align: center;
margin-bottom: 40px;
font-size: 1.6rem;
color: #222;
}
.glamping_content .sche_head {
display: flex;
justify-content: space-around;
margin-bottom: 70px;
}
.glamping_content .sche_head .txt {
background: #fff;
width: 554px;
padding: 5px;
}
.glamping_content .sche_head .txt .inner {
border: 1px solid #eec9af;
padding: 40px 50px 35px;
box-sizing: border-box;
height: 100%;
}
.glamping_content .sche_head .txt .inner.night {
border: 1px solid #adc2d5;
}
.glamping_content .sche_head .txt .inner.morning {
border: 1px solid #a0c7b5;
}
.glamping_content .sche_head .txt h3 {
font-size: 4rem;
text-align: center;
}
.glamping_content .sche_head .txt h3.day {
color: #bd806c;
}
.glamping_content .sche_head .txt h3.night {
color: #6c808e;
}
.glamping_content .sche_head .txt h3.morning {
color: #648bb8;
}
.glamping_content .sche_head .txt .time {
text-align: center;
margin: 10px auto 20px;
width: 200px;
}
.glamping_content .sche_head .txt .time p {
padding: 5px 0;
}
.glamping_content .sche_head .txt .time p.en {
border-bottom: 2px solid #eec9af;
}
.glamping_content .sche_head .txt .time p.en.night {
border-bottom: 2px solid #adc2d5;
}
.glamping_content .sche_head .txt .time p.en.morning {
border-bottom: 2px solid #a0c7b5;
}
.glamping_content .sche_head .txt p.under {
line-height: 2;
}
.glamping_content .sche_head.reverse {
flex-direction: row-reverse;
}
.glamping_content .slides {
width: 900px;
margin: 0 auto;
}
.glamping_content .slides .slide {
margin-bottom: 20px;
}
.glamping_content .slides ul.slide_pager {
display: flex;
}
.container.news_single {
background: #fff;
padding: 80px 100px 100px;
min-height: 500px;
}
@media screen and (max-width: 896px) {
.container.news_single {
background: #fff;
padding: 10% 5%;
min-height: 300px;
box-sizing: border-box;
}
}
.container.news_single p.date {
text-align: center;
}
.container.news_single h2 {
padding: 15px 0 25px;
margin-bottom: 55px;
font-size: 2.4rem;
}
.container.news_single .article_content img {
margin: 0 auto 45px;
max-width: 100%;
height: auto;
}
@media screen and (max-width: 896px) {
.container.news_single .article_content img {
height: auto;
object-fit: cover;
}
}
.container.news_single .article_content p {
line-height: 2;
word-break: break-word;
}
.container.news_list p.news_list {
text-align: center;
font-size: 2rem;
font-weight: bold;
}
ul.news_list li {
padding: 20px;
border-bottom: 1px solid #ccc;
line-height: 1.5;
}
ul.news_list li .cate {
color: #b8bccc;
font-size: 1.4rem;
}
.qa_dl {
font-size: 1.6rem;
line-height: 1.7em;
margin-bottom: 50px;
}
.qa_dl dd {
text-indent: 1em;
}
@media screen and (max-width: 896px) {
.qa_dl dd {
text-indent: 0;
}
}
.qa_green_text {
color: #b8bccc;
font-size: 2rem;
font-weight: bold;
}
.qa_orange_text {
color: #0a184d;
font-size: 2rem;
font-weight: bold;
}
.qa_mb {
margin-bottom: 20px;
}  footer .info {
margin-bottom: 2em;
}
.checkin_box {
margin-bottom: 1em;
} .arrow {
position: relative;
display: inline-block;
padding: 0 0 0 16px;
color: #000;
vertical-align: middle;
text-decoration: none;
font-size: 15px;
}
.arrow::before,
.arrow::after {
position: absolute;
top: 0;
bottom: 0;
right: 0;
margin: auto;
content: "";
vertical-align: middle;
}
.external::before {
width: 12px;
height: 2px;
background: #b8bccc;
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
.external::after {
right: 1px;
width: 8px;
height: 8px;
border-top: 2px solid #b8bccc;
border-right: 2px solid #b8bccc;
}
.wrapper_video {
margin: 0 auto;
width: 800px;
text-align: left;
position: relative;
visibility: hidden;
}
#video {
width: 100%;
margin: 0 auto;
padding: 0;
background-color: #000;
}
.video_box {
width: 800px;
height: auto;
margin: 0 auto;
text-align: center;
}
.video_box video {
width: 100%;
height: auto;
margin: 0 auto;
} #fixedTop {
right: 10px;
bottom: 230px;
color: #fff;
text-align: center;
line-height: 60px;
text-decoration: none;
vertical-align: middle;
display: none;
width: 60px;
height: 60px;
border-radius: 50%;
background: rgba(184, 188, 204, 0.5);
position: fixed;
z-index: 99;
font-size: 20px;
}
#fixedTop:hover {
background: rgba(135, 137, 140, 1);
}
@media screen and (max-width: 896px) {
#fixedTop {
display: none !important;
}
} #content h2 {
font-size: 4rem;
text-align: center;
padding: 10rem 0 6rem;
margin: 0 auto;
}
#content p {
text-align: center;
padding: 3rem 0;
}
.pc {
display: none !important;
} .transactions {
width: 90%;
margin: auto;
}
.transactions p {
margin-bottom: 20px;
}
.info .operating {
text-decoration: underline;
} html {
margin-top: 0px;
}
.top_sec1 {
padding-top: 80px;
background: #000;
padding-bottom: 160px; background-position: top right;
background-repeat: no-repeat;
background-size: 500px;
}
.sec1-img-parent { background-position: left;
background-repeat: no-repeat;
background-size: 400px;
}
.top_sec1 .sec1-img0 {
max-width: 100%;
width: 600px;
margin-right: auto;
margin-left: auto;
margin-bottom: -80px;
margin-top: 60px;
}
.top_sec1 .sec1-img1 {
max-width: 1300px;
margin-right: auto;
margin-left: auto;
}
.top_sec1 h2 {
color: #fff;
}
.top_sec1 > h2 {
margin-bottom: 30px;
color: #fff;
text-align: center;
font-size: 45px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 3px;
}
.top_sec1 > h3 {
text-align: center;
margin-bottom: 40px;
color: #d7d7d7;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 3px;
}
.top_sec1 p {
color: #fff;
}
.top-sec1-flex-parent { background-position: left;
background-repeat: no-repeat;
background-size: 400px;
}
.top-sec1-flex {
display: flex;
max-width: 1200px;
margin-right: auto;
margin-left: auto;
}
.top-sec1-flex img {
max-width: 100%;
}
.sec1-flex-left {
width: 50%;
padding: 0px 20px;
}
.sec1-left-txt {
color: #fff;
font-size: 40px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.sec1-left-txt2 {
margin-bottom: 60px;
}
.sec1-flex-left h2 {
text-align: left;
margin-top: 30px;
margin-bottom: 50px;
color: #fff;
font-size: 35px;
font-style: normal;
font-weight: 500;
line-height: normal;
letter-spacing: 2px;
}
.sec1-flex-right {
width: 50%;
padding: 0px 20px;
}
.sec1-flex-left img {
margin-left: 40px;
}
@media screen and (max-width: 1350px) {
.top_sec1 .sec1-img1 {
max-width: 100%;
margin-right: auto;
margin-left: auto;
}
}
@media screen and (max-width: 1024px) {
.sec1-left-txt {
text-align: center;
}
.sec1-left-txt2 {
text-align: center;
}
.top-sec1-flex {
display: block;
margin-top: 80px;
}
.sec1-flex-left {
width: 100%;
padding: 0px;
}
.sec1-flex-left-inner {
padding: 20px;
}
.sec1-flex-left-inner h2 {
text-align: center;
}
.sec1-flex-left img {
margin-right: auto;
margin-left: auto;
max-width: 80%;
}
.sec1-flex-right {
width: 100%;
padding: 0px;
}
.sec1-flex-right img {
margin-right: auto;
margin-left: auto;
margin-top: 40px;
width: 80%;
max-width: 450px;
}
}
@media screen and (max-width: 650px) {
.top_sec1 {
}
.top_sec1 .sec1-img0 {
display: none;
}
.top_sec1 > h2 {
display: none;
}
.top_sec1 > h3 {
display: none;
}
.sec1-left-txt {
font-size: 17px;
}
.sec1-flex-left h2 {
margin-top: 17px;
}
} .top_sec2 > h2 {
color: #000;
text-align: center; font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.top_sec2 .sec2-img0 {
max-width: 100%;
width: 330px;
margin-right: auto;
margin-left: auto;
margin-bottom: -80px;
}
.top-sec2-flex {
display: flex;
max-width: 1200px;
margin-right: auto;
margin-left: auto;
}
.sec2-concept-ttl {
color: #a62b00;
text-align: left;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.top-sec2-flex.odd {
flex-direction: row-reverse;
height: 600px;
}
.sec2-flex-left {
width: 50%;
height: 600px; }
.sec2-flex-left img {
max-width: 100%;
height: 600px;
object-fit: cover;
}
.sec2-flex-right {
width: 50%;
padding: 5% 2.5% 0px;
}
.sec2-flex-right h2 {
margin-top: 10px;
margin-bottom: 30px;
text-align: left;
color: #000;
font-size: 25px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 2px;
}
.sec2-concept-txt {
color: #333;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%;
}
@media screen and (max-width: 600px) {
.top-sec2-flex {
display: block;
padding: 20px;
max-width: 600px;
}
.sec2-flex-left {
width: 100%;
padding: 0px 0px;
}
.sec2-flex-right {
width: 100%;
padding: 0px 0px;
margin-top: 25px;
margin-bottom: 30px;
}
.sec2-flex-left img {
margin-right: auto;
margin-left: auto;
max-width: 85%;
}
.sec2-flex-right .sec2-concept-ttl {
text-align: center;
}
.sec2-flex-right h2 {
font-size: 18px;
}
.top-sec2-flex.odd {
height: auto;
background: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/witewall_3.webp);
}
.sec2-flex-left {
width: 100%;
height: auto; }
.sec2-flex-left img {
max-width: 100%;
height: auto;
object-fit: cover;
}
}
@media screen and (max-width: 650px) {
.top_sec2 {
padding-bottom: 0px;
}
.top_sec2 > h2 {
font-size: 26px;
letter-spacing: 0px;
}
.sec2-flex-right h2 {
margin-top: 5px;
}
.sec2-flex-right {
margin-top: 20px;
}
} .top_sec3 {
padding-top: 120px;
padding-bottom: 80px;
background: #000;
}
.top_sec3 .sec3-img0 {
max-width: 100%;
width: 280px;
margin-right: auto;
margin-left: auto;
margin-bottom: -40px;
}
.top_sec3 > h2 {
color: #fff;
margin-bottom: 20px;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.top-sec3-flex {
display: flex;
max-width: 1200px;
margin-right: auto;
margin-left: auto;
margin-top: 60px;
margin-bottom: 90px;
}
.top-sec3-flex img {
width: 100%;
}
.top-sec3-flex h2 {
color: #fff;
margin-top: 20px;
margin-bottom: 15px;
text-align: left;
font-size: 28px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.top-sec3-flex span {
width: 65px;
border: 1px solid #fff;
color: #fff;
display: inline-block;
text-align: center;
margin-right: 20px;
padding-top: 1px;
line-height: normal;
letter-spacing: 3px;
}
.top-sec3-flex p {
color: #fff;
margin-top: 6px;
line-height: normal;
letter-spacing: 3px;
}
.sec3-flex-left {
width: 50%;
padding: 0px 40px;
}
.sec3-flex-right {
width: 50%;
padding: 0px 40px;
}
.sec3-btn {
text-align: center;
margin-top: 90px;
margin-bottom: 80px;
}
.sec3-btn a {
border: 1px solid #fff;
background: #3e3e3e;
padding: 20px 67px;
color: #fff;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
@media screen and (max-width: 1200px) {
.top-sec3-flex {
max-width: 100%;
}
.top-sec3-flex img {
max-width: 100%;
}
}
@media screen and (max-width: 650px) {
.top_sec3 {
padding-bottom: 20px;
}
.top-sec3-flex {
display: block;
padding: 0px 20px;
max-width: 500px;
}
.top_sec3 > h2 {
font-size: 30px;
}
.top-sec3-flex h2 {
text-align: center;
font-size: 25px;
}
.top-sec3-flex img {
margin-right: auto;
margin-left: auto;
}
.sec3-flex-left {
width: 100%;
padding: 0px 0px;
}
.sec3-flex-right {
width: 100%;
padding: 0px 0px;
margin-top: 60px;
}
.sec3-btn a {
padding: 20px 35px;
font-size: 15px;
}
} .top_sec4 {
padding-top: 10px;
background: #000;
padding-bottom: 100px;
}
.top-sec4-flex {
display: flex;
max-width: 1400px;
margin-right: auto;
margin-left: auto;
margin-top: 60px;
justify-content: center;
}
.sec4-flex-child {
width: 33%;
padding: 0px 0px;
position: relative;
}
.sec4-flex-child img {
max-width: 100%;
}
.sec4-flex-child p {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: 100%; letter-spacing: 0.729px;
width: 100%;
position: absolute;
bottom: 40px;
left: 50%;
transform: translateX(-50%);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
}
@media screen and (max-width: 1024px) {
.top-sec4-flex {
max-width: 100%;
}
}
@media screen and (max-width: 650px) {
.top-sec4-flex {
display: block;
padding: 0px 20px;
max-width: 500px;
}
.top-sec4-flex img {
margin-right: auto;
margin-left: auto;
}
.sec4-flex-child {
width: 100%;
padding: 0px 0px;
margin-top: 30px;
}
.sec4-flex-child p {
font-size: 25px;
}
} .top_main_bnr {
width: 60%;
margin: 40px auto 20px;
}
.top_main_bnr img {
width: 100%;
}
@media screen and (max-width: 896px) {
.top_main_bnr {
width: 100%;
margin: 40px auto 20px;
}
} .top_sec5 {
padding-top: 30px;
padding-bottom: 30px;
background: #fff; background-position: top right;
background-repeat: no-repeat;
background-size: 500px;
}
.top_sec5 .sec5-img0 {
max-width: 100%;
width: 280px;
margin-right: auto;
margin-left: auto;
margin-bottom: -50px;
}
.top_sec5 > h2 {
margin-bottom: 20px;
font-size: 24px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.sec5-posts {
max-width: 900px;
margin-right: auto;
margin-left: auto;
padding-right: 20px;
padding-left: 20px;
}
.top_sec5 li {
color: #fff;
padding-left: 15px;
margin-top: 20px;
}
.top_sec5 .date {
display: inline-block;
width: 100px;
color: #898989;
font-size: 14px;
font-style: normal;
font-weight: 500;
line-height: 17px; letter-spacing: 0.85px;
}
.top_sec5 a {
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 150%; }
@media screen and (max-width: 896px) {
.sec5-posts {
max-width: 80%;
}
.top_sec5 .date {
margin-bottom: 10px;
}
.top_sec5 li {
margin-bottom: 10px;
}
}
@media screen and (max-width: 650px) {
.sec5-posts {
max-width: 100%;
}
} .top_sec6 {
padding-top: 40px;
background: #000;
padding-bottom: 60px;
}
.top_sec6 .sec6-img0 {
max-width: 100%;
width: 280px;
margin-right: auto;
margin-left: auto;
margin-bottom: -63px;
}
.top_sec6 > h2 {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.sec6-flex-right > h2 {
color: #fff;
margin-bottom: 20px;
font-size: 25px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 3px;
}
.sec6-flex-right p {
color: #fff;
font-size: 17px;
font-style: normal;
font-weight: 400;
line-height: normal;
letter-spacing: 3px;
}
.top_sec6 .sec6-map {
padding: 0px 20px;
text-align: center;
margin-top: 60px;
}
.top_sec6 .sec6-map iframe {
max-width: 100%;
}
.top-sec6-flex {
display: flex;
max-width: 1040px;
margin-right: auto;
margin-left: auto;
margin-top: 80px;
padding: 0px 20px;
}
.sec6-flex-left {
width: 50%;
padding: 0px 20px;
}
.sec6-flex-left img {
max-width: 100%;
}
.sec6-flex-right {
width: 50%;
padding: 60px 30px 0px;
}
.sec6-flex-right h2 {
color: #fff;
text-align: left;
margin-bottom: 30px;
}
@media screen and (max-width: 1024px) {
.top_sec6 {
padding-bottom: 20px;
}
.sec6-flex-right > h2 {
text-align: center;
}
.top-sec6-flex {
display: block;
padding: 0px 20px;
max-width: 700px;
}
.sec6-flex-left {
width: 100%;
padding: 0px 0px;
}
.sec6-flex-left img {
margin-right: auto;
margin-left: auto;
}
.sec6-flex-right {
width: 100%;
padding: 0px 0px;
margin-top: 60px;
}
.top_sec6 .sec6-map iframe {
max-width: 85%;
}
}
@media screen and (max-width: 650px) {
.top_sec6 .sec6-map iframe {
max-width: 100%;
}
} .top_sec1 .sec1-img0-room {
max-width: 100%;
width: 400px;
margin-right: auto;
margin-left: auto;
margin-bottom: -58px;
margin-top: 60px;
}
.sec1-room {
padding: 60px 20px 0px 20px;
max-width: 800px;
margin-right: auto;
margin-left: auto;
}
.sec1-room > h3 {
text-align: center;
margin-bottom: 40px;
color: #d7d7d7;
font-size: 40px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 3px;
}
.sec1-room > p {
color: #fff;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 160%; letter-spacing: 0.85px;
}
.room-flex {
display: flex;
justify-content: space-between;
max-width: 1400px;
padding-right: 40px;
padding-left: 40px;
margin-right: auto;
margin-left: auto;
}
.room-img {
width: 55%;
}
.room-text {
width: 45%;
color: #fff;
padding-top: 60px;
padding-left: 60px;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%; }
.room-text p {
margin-bottom: 60px;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%; }
.room-text table {
color: #fff;
font-size: 15px;
font-style: normal;
font-weight: 500;
width: 100%;
}
.room-text table tr {
border-bottom: 1px solid #bebebe;
}
.room-text table tr:first-child {
border-top: 1px solid #bebebe;
}
.room-text table th {
min-width: 120px;
text-align: left;
padding: 20px 0px 20px 40px;
vertical-align: middle;
}
.room-text table td {
vertical-align: middle;
}
.top-sec1-flex-parent-room2 { background-position: right;
background-repeat: no-repeat;
background-size: 400px;
}
.room-img .n2-align-content-start {
background: #000;
}
.room-img .n2-thumbnail-dot {
margin: 16px 8px !important;
}
.room-ttl {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
margin-top: 150px;
margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
.room-flex {
display: block;
}
.room-img {
max-width: 600px;
width: 100%;
margin-right: auto;
margin-left: auto;
}
.room-text {
width: 100%;
max-width: 600px;
color: #fff;
padding-top: 30px;
padding-left: 0px;
margin-right: auto;
margin-left: auto;
color: #fff;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%;
}
}
@media screen and (max-width: 650px) {
.top_sec1 .sec1-img0-room {
display: none;
}
.room-flex {
padding-right: 15px;
padding-left: 15px;
}
.sec1-room > h3 {
font-size: 35px;
}
.sec1-room > p {
font-size: 16px;
}
.room-ttl {
font-size: 28px;
}
.room-text p {
margin-bottom: 30px;
font-size: 14px;
}
.room-text table th {
min-width: 100px;
padding: 15px 0px 15px 20px;
}
} .top_sec2-room {
padding-top: 80px;
padding-right: 20px;
padding-left: 20px;
background: #000;
padding-bottom: 80px;
background-image: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/room-sec2.webp);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.sec2-room-width {
max-width: 800px;
padding: 80px 40px;
background: #1e1e1e;
margin-right: auto;
margin-left: auto;
}
.sec2-room-width img {
margin-right: auto;
margin-left: auto;
margin-bottom: -80px;
}
.sec2-room-width h2 {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
margin-bottom: 40px;
}
.sec2-room-width table {
color: #fff;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 170%; width: 80%;
margin-right: auto;
margin-left: auto;
}
.sec2-room-width table tr {
border-bottom: 1px solid #505050;
}
.sec2-room-width table tr:first-child {
border-top: 1px solid #505050;
}
.sec2-room-width table th {
width: 50%;
text-align: left;
padding: 20px 0px 20px 40px;
vertical-align: middle;
}
.sec2-room-width table td {
width: 50%;
vertical-align: middle;
text-align: left;
}
@media screen and (max-width: 1024px) {
.sec2-room-width table {
width: 100%;
}
}
@media screen and (max-width: 650px) {
.top_sec2-room {
padding-top: 40px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 40px;
}
.sec2-room-width {
padding: 80px 20px;
}
.sec2-room-width table th {
padding: 10px 0px 10px 10px;
}
.sec2-room-width h2 {
font-size: 28px;
}
.sec2-room-width table {
font-size: 16px;
}
} .top_sec2-meal.even {
background-image: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/meal-sec2-back.webp);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.top_sec2-meal {
padding-top: 80px;
padding-bottom: 80px;
}
.top_sec2-meal > h2 {
color: #000;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.top_sec2-meal .sec2-img0 {
max-width: 100%;
width: 330px;
margin-right: auto;
margin-left: auto;
margin-bottom: -30px;
}
.top-sec2-meal-flex {
display: flex;
max-width: 1200px;
margin-right: auto;
margin-left: auto;
margin-top: 60px;
}
.sec2-concept-ttl {
color: #a62b00;
text-align: left;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: normal;
}
.top-sec2-meal-flex.odd {
flex-direction: row-reverse;
}
.sec2-flex-meal-left {
width: 55%;
padding: 0px 20px;
}
.sec2-flex-meal-left img {
max-width: 100%;
width: 100%;
}
.sec2-flex-meal-right {
width: 45%;
padding: 30px 20px 0px;
}
.sec2-flex-meal-right h2 {
padding: 5px 15px;
display: inline-block;
background: #531909;
margin-top: 10px;
margin-bottom: 30px;
text-align: left;
color: #fff;
font-size: 30px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.sec2-flex-meal-right ul {
padding-left: 20px;
}
.sec2-flex-meal-right li {
list-style-type: disc;
color: #333;
font-size: 18px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.sec2-flex-meal-left .n2-thumbnail-dot {
margin: 16px 8px !important;
}
.top_sec2-meal .sec2-img1 {
max-width: 100%;
width: 330px;
margin-right: auto;
margin-left: auto;
margin-bottom: -60px;
}
@media screen and (max-width: 1024px) {
.top-sec2-meal-flex {
display: block;
padding: 0px 20px;
max-width: 600px;
}
.sec2-flex-meal-left {
width: 100%;
padding: 0px 0px;
}
.sec2-flex-meal-right {
width: 100%;
padding: 0px 0px;
margin-top: 25px;
padding-bottom: 120px;
}
.sec2-flex-meal-left img {
margin-right: auto;
margin-left: auto;
max-width: 100%;
}
.sec2-flex-meal-right .sec2-concept-ttl {
text-align: center;
}
.sec2-flex-meal-right h2 {
text-align: center;
}
}
@media screen and (max-width: 650px) {
.top_sec2-meal {
padding-bottom: 0px;
}
.top_sec2-meal > h2 {
font-size: 30px;
letter-spacing: 0px;
}
.sec2-flex-meal-right h2 {
margin-top: 5px;
display: block;
font-size: 26px;
width: 200px;
margin-right: auto;
margin-left: auto;
}
.sec2-flex-meal-right li {
font-size: 15px;
}
.sec2-flex-meal-right {
margin-top: 20px;
}
} .top_sec2 .sec2-img1 {
max-width: 100%;
width: 330px;
margin-right: auto;
margin-left: auto;
margin-bottom: -50px;
} .dogrun-sec3 {
background: #000;
padding-top: 80px;
padding-bottom: 80px;
}
.dogrun-sec3 p {
color: #fff;
}
.dogrun-back {
background-image: none;
}
.dogrun-sec3 .sec2-img0 {
max-width: 100%;
width: 330px;
margin-right: auto;
margin-left: auto;
margin-bottom: -30px;
}
.dogrun-sec3 > h2 {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
@media screen and (max-width: 650px) {
.dogrun-sec3 > h2 {
font-size: 30px;
letter-spacing: 0px;
}
} .top_sec2-dog {
padding-top: 80px;
padding-right: 20px;
padding-left: 20px;
background: #000;
padding-bottom: 80px;
}
.sec2-dog-width {
max-width: 800px;
padding: 80px 40px;
background: #313131;
margin-right: auto;
margin-left: auto;
}
.sec2-dog-width img {
margin-right: auto;
margin-left: auto;
margin-bottom: -80px;
}
.sec2-dog-width h2 {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
margin-bottom: 40px;
}
.sec2-dog-width table {
color: #fff;
font-size: 18px;
font-style: normal;
font-weight: 500;
line-height: 170%; width: 80%;
margin-right: auto;
margin-left: auto;
}
.sec2-dog-width table tr {
border-bottom: 1px solid #505050;
}
.sec2-dog-width table tr:first-child {
border-top: 1px solid #505050;
}
.sec2-dog-width table th {
width: 50%;
text-align: left;
padding: 20px 0px 20px 40px;
vertical-align: middle;
}
.sec2-dog-width table td {
width: 50%;
vertical-align: middle;
text-align: left;
}
@media screen and (max-width: 1024px) {
.sec2-dog-width table {
width: 100%;
}
}
@media screen and (max-width: 650px) {
.top_sec2-dog {
padding-top: 40px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 40px;
}
.sec2-dog-width {
padding: 80px 20px;
}
.sec2-dog-width table th {
padding: 10px 0px 10px 10px;
}
.sec2-dog-width h2 {
font-size: 28px;
}
.sec2-dog-width table {
font-size: 16px;
}
} .dog-img1 {
max-width: 100%;
width: 230px;
margin-right: auto;
margin-left: auto;
margin-bottom: -65px;
}
.sec-dog-width {
max-width: 1350px;
margin-right: auto;
margin-left: auto;
margin-top: 25px;
}
.sec-dog-flex {
display: flex;
}
.sec-dog-item {
width: 33%;
padding: 10px 20px;
}
.dog-sec4-img {
width: 100%;
margin-bottom: 25px;
}
.sec-dog-item h3 {
color: #000;
font-size: 30px;
font-style: normal;
line-height: normal;
letter-spacing: 3px;
}
.sec-dog-item p {
color: #333;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%; }
@media screen and (max-width: 1024px) {
.sec-dog-item {
padding: 10px 10px;
}
.sec-dog-item h3 {
font-size: 26px;
}
.sec-dog-item p {
font-size: 14px;
}
}
@media screen and (max-width: 650px) {
.sec-dog-flex {
display: block;
}
.sec-dog-item {
width: 90%;
margin-right: auto;
margin-left: auto;
}
} .top_sec1 .sec1-img0-spa {
max-width: 100%;
width: 200px;
margin-right: auto;
margin-left: auto;
margin-bottom: -73px;
margin-top: 60px;
}
.sec1-spa {
padding: 60px 20px 0px 20px;
max-width: 800px;
margin-right: auto;
margin-left: auto;
}
.sec1-spa > h3 {
text-align: center;
margin-bottom: 40px;
color: #d7d7d7;
font-size: 40px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 3px;
}
.sec1-spa > p {
color: #fff;
text-align: center;
font-size: 18px;
font-style: normal;
font-weight: 600;
line-height: 160%; letter-spacing: 0.85px;
}
.spa-flex {
display: flex;
justify-content: space-between;
max-width: 1400px;
padding-right: 40px;
padding-left: 40px;
margin-right: auto;
margin-left: auto;
}
.spa-flex-reverse {
flex-direction: row-reverse;
}
.spa-img {
width: 50%;
}
.spa-img img {
max-width: 100%;
}
.spa-text {
width: 50%;
color: #fff;
padding-top: 60px;
padding-left: 60px;
color: #fff;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%; }
.spa-text-left {
padding-top: 60px;
padding-right: 60px;
}
.spa-text h4 {
text-align: left;
color: #fff;
font-size: 30px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
}
.spa-text p {
margin-bottom: 60px;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%; }
.spa-text table {
color: #fff;
font-size: 15px;
font-style: normal;
font-weight: 500;
width: 100%;
}
.spa-text table tr {
border-bottom: 1px solid #bebebe;
}
.spa-text table tr:first-child {
border-top: 1px solid #bebebe;
}
.spa-text table th {
min-width: 120px;
text-align: left;
padding: 20px 0px 20px 40px;
vertical-align: middle;
}
.spa-text table td {
vertical-align: middle;
}
.top-sec1-flex-parent-spa2 {
padding-top: 80px;
}
.spa-img .n2-align-content-start {
background: #000;
}
.spa-img .n2-thumbnail-dot {
margin: 16px 8px !important;
}
.spa-ttl {
color: #fff;
text-align: center;
font-size: 35px;
font-style: normal;
font-weight: 700;
line-height: normal;
letter-spacing: 3px;
margin-top: 150px;
margin-bottom: 50px;
}
@media screen and (max-width: 1024px) {
.spa-flex {
display: block;
}
.spa-img {
max-width: 600px;
width: 100%;
margin-right: auto;
margin-left: auto;
}
.spa-text {
width: 100%;
max-width: 600px;
color: #fff;
padding-top: 30px;
padding-left: 0px;
margin-right: auto;
margin-left: auto;
color: #fff;
font-size: 15px;
font-style: normal;
font-weight: 500;
line-height: 170%;
}
.spa-text-left {
padding-right: 0px;
}
}
@media screen and (max-width: 650px) {
.top_sec1 .sec1-img0-spa {
display: none;
}
.spa-flex {
padding-right: 15px;
padding-left: 15px;
}
.sec1-spa > h3 {
font-size: 35px;
}
.sec1-spa > p {
font-size: 16px;
}
.spa-ttl {
font-size: 28px;
}
.spa-text p {
margin-bottom: 30px;
font-size: 14px;
}
.spa-text table th {
min-width: 100px;
padding: 15px 0px 15px 20px;
}
} .spa-slide-parent {
background-image: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/spa-sec1-slide-back.png);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.top-sec1-flex-grandparent {
background-image: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/spa-sec1-room-back.png);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.spa-slide {
max-width: 1100px;
margin-right: auto;
margin-left: auto;
padding-right: 40px;
padding-left: 40px;
margin-top: 100px;
}
.spa-slide .n2-align-content-start {
background: #000;
}
.spa-slide .n2-thumbnail-dot {
margin: 16px 8px !important;
}
.spa-slide h3 {
text-align: center;
margin-bottom: 40px;
color: #d7d7d7;
font-size: 40px;
font-style: normal;
font-weight: 600;
line-height: normal;
letter-spacing: 3px;
}
@media screen and (max-width: 650px) {
.spa-slide {
padding-right: 20px;
padding-left: 20px;
}
.sec1-spa > h3 {
font-size: 35px;
}
.spa-slide h3 {
font-size: 35px;
}
} .top_sec2-spa {
padding-top: 80px;
padding-right: 20px;
padding-left: 20px;
background: #000;
padding-bottom: 80px;
}
@media screen and (max-width: 650px) {
.top_sec2-spa {
padding-top: 40px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 40px;
}
} .top_under {
height: 600px;
width: 100%;
overflow: hidden;
position: relative;
}
.top_under img {
height: 600px;
width: 100%;
object-fit: cover;
}
@media screen and (max-width: 650px) {
.top_under {
height: 270px;
}
.top_under img {
height: 270px;
}
}
.hx-type3 {
font-size: 2.2rem;
font-weight: 400;
line-height: 1.5;
border-bottom: #fff 1px solid;
padding-top: 15px;
padding-bottom: 15px;
text-align: left;
} .column-box {
background: url(//www.chichibu-privatevilla-komura.com/wp-content/themes/komura/img/witewall_3.webp);
}
.column-box .txt-box {
width: 50%;
}
.column-box .img-box {
width: calc(100% - 50%);
}
.column-box .img-box img {
width: 100%;
height: 100%;
object-fit: cover;
font-family: "object-fit: cover;";
}
.column-box.column2 .txt-box,
.column-box.column2 .img-box {
width: 50%;
}
@media screen and (max-width: 1400px) {
.column-box .img-box {
height: 600px;
}
}
@media screen and (max-width: 940px) {
.column-box .img-box {
height: 710px;
}
} @media screen and (min-width: 768px) {
.column-box .txt-box {
padding-right: 70px;
padding-left: 70px;
}
}  @media screen and (max-width: 767px) {
.column-box .txt-box {
width: 100%;
padding-top: 0;
padding-right: 2%;
padding-left: 2%;
padding-bottom: 20px;
}
.column-box .img-box {
width: 100%;
height: auto;
}
.column-box.column2 .txt-box,
.column-box.column2 .img-box {
width: 100%;
}
} .list-box {
margin-top: 100px;
}
.list-box .inr {
justify-content: center;
}  .top_bnr {
margin: 50px auto;
}   .bnr_slider:not(.slick-initialized) {
display: flex !important; overflow: hidden !important; flex-wrap: nowrap !important; margin: 0 auto;
padding: 0;
list-style: none;
width: 100%;
} .bnr_slider:not(.slick-initialized) > li {
flex-shrink: 0 !important; width: 100% !important; display: block !important;
} .bnr_slider:not(.slick-initialized) > li img {
width: 100% !important;
max-width: 100% !important; height: auto !important;
display: block;
margin: 0 auto;
}
.top_bnr ul li {
margin: 0 5px;
}
.top_bnr ul li img {
width: 100%;
display: block;
object-fit: cover;
}
@media screen and (max-width: 896px) {
.top_bnr ul li {
margin: 0 10px;
}
}  .slick-dots {
display: flex;
justify-content: center;
list-style: none;
padding: 0;
margin: 20px 0;
} .slick-dots li button {
font-size: 0; line-height: 0;
display: block;
width: 12px;
height: 12px;
padding: 0;
cursor: pointer;
color: transparent;
border: 0;
outline: none;
background: #ccc; border-radius: 50%;
} .slick-dots li.slick-active button {
background: #333; }
.bnr_slider .slick-dots {
display: flex;
justify-content: center;
position: static;
padding: 10px;
}
.bnr_slider .slick-dots li {
margin: 0 5px;
list-style: none;
} div#n2-ss-25 .n2-style-0b1501f187dd486f0b3833aafb1a1b8d-dot.n2-active,
div#n2-ss-25 .n2-style-0b1501f187dd486f0b3833aafb1a1b8d-dot:hover,
div#n2-ss-25 .n2-style-0b1501f187dd486f0b3833aafb1a1b8d-dot:focus {
background: RGB(255, 255, 255) !important;
}
@media screen and (max-width: 896px) { .n2-ss-slider img {
object-fit: cover;
}
} ul.navi-top li ul.menubar2 li a {
background: #f6f6f6;
color: #777;
}
ul.navi-top a:hover {
color: white; background-color: grey; }
ul.navi-top {
position: fixed;
top: 0;
margin: 0;
padding: 0;
font-size: 14px; text-align:
cen3959 z-index,
50;
padding: 20px;
right: 0;
}  ul.navi-top li {
display: inline-block;
list-style-type: none;
position: relative;
}
ul.navi-top a {
line-height: 36px; text-align: center; padding-left: 10px;
text-decoration: none;
font-weight: nomarl;
display: block; padding: 5px 10px;
}
ul.navi-top a.-arr {
pointer-events: none;
}
ul.navi-top a.-arr:after {
content: "\f078";
margin-left: 5px;
font-weight: 900;
font-family: "Font Awesome 5 Free";
}   @media screen and (max-width: 1305px) {
ul.navi-top a { padding: 3px 3px;
}
}
@media screen and (max-width: 1024px) {
ul.navi-top a { padding: 3px 3px;
}
} ul.navi-top ul {
display: none;
margin: 0px;
padding: 0px;
position: absolute;
}
ul.navi-top ul a {
width: 176px; }
ul.navi-top li:hover ul {
display: block;
} .txt_2 {
padding: 30px;
border: 1px solid #999;
width: 50%;
margin: 0 auto;
}
.font-big {
font-size: 22px;
}
@media screen and (max-width: 896px) {
.txt_2 {
padding: 20px;
width: 100%;
}
.font-big {
font-size: 15px;
}
} .language {
z-index: 9999;
position: absolute;
right: 20px;
top: 88px;
width: 140px;
height: 20px;
}
.language > li { width: 100%;
} .language li {
list-style: none;
position: relative;
}
.language li p.lan-en,
.language li a {
background: #eee;
display: block;
text-align: center;
text-decoration: none;
width: 100%;
padding: 5px 0;
border-radius: 18px;
font-size: 13px;
} .language li li {
height: 0;
overflow: hidden;
transition: 0.5s;
margin-top: 1px;
margin-bottom: 13px;
}
.language li:hover > ul > li {
height: 2rem;
overflow: visible;
}
@media screen and (max-width: 1570px) {
.language {
top: 84px;
}
}
@media screen and (max-width: 896px) {
.language {
left: 12px;
top: 10px;
width: 90px;
}
}   .inquiry {
margin: 0 auto;
}
.inquiry tr {
width: 75%;
margin: 0 auto;
}
.inquiry th,
.inquiry td {
display: block !important;
width: 80%;
border-top: none !important;
-webkit-box-sizing: border-box !important;
-moz-box-sizing: border-box !important;
box-sizing: border-box !important;
padding: 1rem;
background: #fff;
} .inquiry .haveto,
.inquiry .any {
font-size: 1.2rem;
} .inquiry th {
text-align: left;
font-size: 1.6rem;
color: #444;
padding-right: 5px;
vertical-align: top;
position: relative;
} .inquiry td {
font-size: 1.6rem;
} max .entry-content .inquiry tr,
.entry-content table {
border: solid 1px #ededed;
} .haveto {
font-size: 1.2rem;
padding: 4px 12px;
background: #b66d6d;
color: #fff;
border-radius: 3px;
position: absolute;
right: 0;
top: 36px;
} .any {
font-size: 1.2rem;
padding: 5px 12px;
background: #17283f;
color: #fff;
border-radius: 3px;
position: absolute;
right: 0;
top: 48px;
} #formbtn2 {
display: block;
padding: 10px;
width: 300px;
font-size: 1.5rem;
margin: 60px auto 0;
border: 1px solid #95a7be;
}
#formbtn {
display: block;
padding: 10px;
width: 300px;
font-size: 1.5rem;
margin: 60px auto 0;
border: 1px solid #95a7be;
} #formbtn:hover {
background: #fff;
color: #95a7be;
border: 1px solid #95a7be;
}
.wpcf7-form-control {
width: 60%;
margin: 0 auto;
width: 96%;
height: 50px;
border-radius: 2px;
padding-left: 10px;
border: 1px solid #eee;
}
.cont_fl {
width: 96%;
height: 50px;
border-radius: 2px;
padding-left: 10px;
border: 1px solid #eee;
}
.cont_fl2 {
width: 94%;
border: 0;
border-radius: 5px;
padding: 10px;
}
.cont_t {
margin-top: 5px;
}
.cont_b {
margin-bottom: 20px;
border: 1px solid #eee;
}
.line_h {
line-height: 1.2;
}
.case_bd {
width: 87%;
margin-left: 6%;
border-bottom: solid #d7d7f4 1px;
}
.bigfont {
font-size: 24px;
letter-spacing: 2px;
padding: 10px;
}
.form.inr {
max-width: 1330px;
margin: 0 auto;
}
.form.inr img {
width: 75%;
margin: 0 auto;
}
.first-box img {
width: 100%;
object-fit: cover;
} @media screen and (min-width: 897px) {
.inquiry {
max-width: 1330px;
width: -moz-available;
width: -webkit-fill-available;
}
.inquiry tr {
display: flex;
}
.inquiry th {
width: 30%;
padding: 38px 3% 20px 5%;
}
.inquiry td {
width: 70%;
padding: 25px 0 0 25px;
}
} @media screen and (max-width: 897px) {
.inquiry {
width: 100%;
max-width: 100%;
}
.inquiry th,
.inquiry td {
width: 100%;
}
.inquiry .pt_40 {
padding-top: 0 !important;
} .haveto {
right: auto;
top: 8px;
margin-left: 10px;
} .any {
right: auto;
top: 8px;
margin-left: 10px;
}
.form.inr img {
width: 99%;
margin: 0 auto;
}
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.sent .wpcf7-response-output {
font-size: 16px;
}
.more-btn {
text-align: center;
margin-top: 20px;
}
.more-btn > button {
font-size: 14px;
color: #fff;
display: inline-block;
padding: 12px 15px;
background: #888;
border: 1px solid #888;
transition: 0.3s;
}
.more-btn > button:hover {
background: #fff;
color: #888;
}
#slide-menu-check {
display: none;
}
#slide-menu-check:checked + .slide-menu-btn > .bdr-box > span:nth-of-type(1) {
transform: rotate(45deg);
}
#slide-menu-check:checked + .slide-menu-btn > .bdr-box > span:nth-of-type(2) {
opacity: 0;
}
#slide-menu-check:checked + .slide-menu-btn > .bdr-box > span:nth-of-type(3) {
transform: rotate(-45deg);
}
#slide-menu-check:checked + .slide-menu-btn + .slide-menu {
left: 0;
}
.slide-menu-btn {
position: fixed;
top: 0;
right: 0;
width: 60px;
height: 60px;
z-index: 10000;
cursor: pointer;
}
.slide-menu-btn > .bdr-box {
width: 50%;
height: 50%;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.slide-menu-btn > .bdr-box > span {
display: block;
width: 100%;
height: 2px;
background: #888;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
transition: 0.3s;
}
.slide-menu-btn > .bdr-box > span:nth-of-type(1) {
transform: translateY(-10px);
}
.slide-menu-btn > .bdr-box > span:nth-of-type(3) {
transform: translateY(10px);
}
@media screen and (min-width: 897px) {
.slide-menu-btn {
display: none;
}
}
.slide-menu {
position: fixed;
width: 100%;
height: 100%;
background: rgba(34, 34, 34, 0.8);
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
z-index: 9999;
padding: 70px 30px;
top: 0;
left: 100%;
overflow: auto;
transition: 0.3s;
}
.slide-menu .logo-box {
width: 100%;
max-width: 200px;
margin: 0 auto 50px;
}
.slide-menu .lang-btn {
position: absolute;
top: 17px;
right: 64px;
}
.slide-menu .lang-btn > #lang-btn {
display: none;
}
.slide-menu .lang-btn > #lang-btn:checked + label + .lang-list {
opacity: 1;
visibility: visible;
}
.slide-menu .lang-btn > label {
display: block;
background: #fff;
padding: 2px 10px;
border-radius: 3px;
cursor: pointer;
}
.slide-menu .lang-btn > label > i {
color: #555;
margin-right: 5px;
}
.slide-menu .lang-btn > .lang-list {
width: 200%;
position: absolute;
top: 42px;
right: 0;
background: #fff;
border-radius: 3px;
opacity: 0;
visibility: hidden;
transition: 0.3s;
}
.slide-menu .lang-btn > .lang-list > ul {
padding: 10px;
}
.slide-menu .lang-btn > .lang-list > ul > li > a {
display: block;
padding: 5px 10px;
position: relative;
padding-left: 20px;
}
.slide-menu .lang-btn > .lang-list > ul > li > a:before {
content: "\f0da";
font-weight: 900;
font-family: "Font Awesome 5 Free";
position: absolute;
top: 50%;
left: 5px;
transform: translateY(-50%);
}
.slide-menu .slide-container {
max-width: 500px;
width: 100%;
margin: 0 auto;
}
.slide-menu .slide-container .slide-btn {
display: flex;
flex-wrap: wrap;
gap: 0 4%;
margin-bottom: 30px;
}
.slide-menu .slide-container .slide-btn > .item {
width: 48%;
}
.slide-menu .slide-container .main-nav {
margin-bottom: 30px;
}
.slide-menu .slide-container .main-nav > ul > * + * {
border-top: 1px solid #fff;
}
.slide-menu .slide-container .main-nav > ul > li > a,
.slide-menu .slide-container .main-nav > ul > li > .slide-acc {
display: block;
font-size: 16px;
color: #fff;
padding: 14px 50px 14px 0;
position: relative;
}
.slide-menu .slide-container .main-nav > ul > li > a:after,
.slide-menu .slide-container .main-nav > ul > li > .slide-acc:after {
content: "\f105";
font-weight: 900;
font-family: "Font Awesome 5 Free";
position: absolute;
top: 50%;
right: 10px;
transform: translateY(-50%);
}
.slide-menu .slide-container .main-nav > ul > li > .slide-acc {
cursor: pointer;
}
.slide-menu .slide-container .main-nav > ul > li > .slide-acc:after {
content: "+";
}
.slide-menu .slide-container .main-nav > ul > li > .slide-acc.-check:after {
content: "\f068";
}
.slide-menu .slide-container .main-nav > ul > li > .in-nav {
margin-bottom: 20px;
display: none;
}
.slide-menu .slide-container .main-nav > ul > li > .in-nav > li > a {
color: #fff;
display: block;
padding: 5px 20px;
}
.slide-menu .slide-container .main-nav > ul > li > .in-nav > li > a:before {
content: "\f0da";
font-weight: 900;
font-family: "Font Awesome 5 Free";
margin-right: 10px;
}
.slide-menu .slide-container > .btn-box {
margin-bottom: 30px;
}
.slide-menu .slide-container > .sns-box {
margin-bottom: 30px;
display: flex;
justify-content: center;
gap: 10px;
}
.slide-menu .slide-container > .sns-box > .item > a {
text-align: center;
line-height: 40px;
width: 40px;
height: 40px;
background: #fff;
font-size: 25px;
display: inline-block;
color: #ff0069;
border-radius: 50%;
}
.slide-menu .slide-container .sub-nav {
display: flex;
flex-wrap: wrap;
justify-content: center;
gap: 10px;
}
.slide-menu .slide-container .sub-nav > li > a {
display: inline-block;
font-size: 12px;
color: #ccc;
position: relative;
padding-left: 10px;
}
.slide-menu .slide-container .sub-nav > li > a:before {
content: "\f0da";
font-weight: 900;
font-family: "Font Awesome 5 Free";
position: absolute;
top: 50%;
left: 0px;
transform: translateY(-50%);
}
@media screen and (min-width: 897px) {
.slide-menu {
display: none;
}
}
.button01,
.button02 {
font-weight: 700;
text-align: center;
text-decoration: none;
width: 100%;
display: inline-block;
border: 1px solid #fff;
border-radius: 3px;
padding: 7px 20px;
}
.button01 {
color: #333;
background: #fff;
}
.button02 {
color: #fff;
}
@media screen and (max-width: 896px) {
.language {
display: none;
}
} .callout-container {
margin: 80px auto;
width: 90%;
}
.callout-container .bnr-box {
width: 100%;
display: flex;
flex-wrap: nowrap;
justify-content: space-around;
}
.callout-container .bnr-box a { width: 30%;
max-width: 700px;
margin: 10px;
}
.callout-container img {
box-shadow: 3px 5px 10px 0px #b5b5b5;
}
@media screen and (max-width: 896px) {
.callout-container {
margin: 40px auto;
width: 94%;
max-width: 100%;
}
.callout-container .bnr-box {
flex-wrap: wrap;
}
.callout-container img {
margin-bottom: 10px;
}
.callout-container .bnr-box a {
width: 100%;
margin: 0 auto;
}
}
.callout-banner {
position: fixed;
z-index: 99;
max-width: 90%;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
border-radius: 10px;
overflow: hidden;
}
.callout-banner img {
width: 100%;
height: auto;
display: block;
} .banner-close {
position: absolute;
top: 8px;
right: 8px;
font-size: 20px;
color: #fff;
background-color: rgba(0, 0, 0, 0.6);
border-radius: 50%;
padding: 4px 10px;
cursor: pointer;
transition: background 0.3s ease;
}
.banner-close:hover {
background-color: rgba(255, 0, 0, 0.7);
}
.banner-pc {
bottom: 20px;
left: 20px;
width: 25%;
display: block;
}
.banner-sp {
bottom: 65px;
left: 50%;
transform: translateX(-50%);
width: 100%;
max-width: 480px;
display: block;
}
@media screen and (max-width: 896px) {
.banner-pc {
display: none;
}
}
@media screen and (min-width: 896px) {
.banner-sp {
display: none;
}
} .instagram_logo {
padding-bottom: 40px;
}
.instagram_logo img {
width: 5%;
margin: 0 auto;
}
@media screen and (max-width: 896px) {
.instagram_logo img {
width: 20%;
}
} .container.ambassador_single {
background: #fff;
padding: 80px 100px 100px;
min-height: 500px;
}
.container.ambassador_single p.date {
text-align: center;
}
.container.ambassador_single h1 {
padding: 15px 0 25px;
margin-bottom: 55px;
font-size: 2.4rem;
}
.container.ambassador_single h2 {
padding-bottom: 10px;
text-align: left;
font-size: 2.2rem;
}
.container.ambassador_single .article_content img {
margin: 30px auto;
max-width: 100%;
height: auto;
}
.container.ambassador_single .article_content p {
line-height: 2;
word-break: break-word;
}
@media screen and (max-width: 896px) {
.container.ambassador_single {
background: #fff;
padding: 10% 5%;
min-height: 300px;
box-sizing: border-box;
}
.container.ambassador_single h1,
.container.ambassador_single h2 {
font-size: 2rem;
}
.container.ambassador_single .article_content img {
height: auto;
object-fit: cover;
}
}  .more-content {
height: 0;
overflow: hidden;
transition: height 0.4s ease;
}
.more-simple-btn {
margin-top: 10px;
border: 1px solid #000;
padding: 10px;
cursor: pointer;
} .page-top {
position: fixed;
display: flex;
align-items: center;
justify-content: center;
right: 5px;
bottom: 45px;
cursor: pointer;
opacity: 0;
visibility: hidden;
border: 0;
color: #333;
transition: all 0.3s ease;
letter-spacing: 3px;
z-index: 1000;
}
.page-top span:before {
position: absolute;
width: 32px;
height: 32px;
border: 1px solid #fff;
background-color: #333;
content: "";
border-radius: 100%;
top: -31px;
left: 5px;
}
.page-top span:after {
position: absolute;
top: -16px;
left: 15px;
transform: rotate(-45deg);
display: block;
width: 12px;
height: 12px;
content: "";
border: 1px solid #fff;
border-width: 1px 1px 0px 0px;
}
.page-top:hover {
opacity: 0.6;
transform: translateY(-5px);
}
.is-active {
opacity: 1;
visibility: visible;
}
@media screen and (max-width: 896px) {
.page-top {
bottom: 57%;
}
}