@charset "utf-8"; .mo>a{ position: relative; } .mo>a:before{ content: '公開準備中'; width: 100%; height: 100%; position: absolute; top: 0; left: 0; -webkit-transition: .2s; transition: .2s; opacity: 0; background-color: #fff; white-space: nowrap; } .mo>a:hover:before{ opacity: 1; } @media screen and (max-width: 750px) { .mo>a:before{ padding: 5px; } } .fadein1 { opacity: 0; -webkit-transition: 1s; transition: 1s; -webkit-transition-delay: .5s; transition-delay: .5s; } .view .fadein1 { opacity: 1; } .fadein2 { opacity: 0; -webkit-transition: 1s; transition: 1s; -webkit-transition-delay: 1s; transition-delay: 1s; } .view .fadein2 { opacity: 1; } html { overflow-x: hidden; } body { font-family: "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", YuGothic, "メイリオ", Meiryo, sans-serif; font-weight: 500; line-height: 1; color: #000; background-color: #fff; position: relative; overflow-x: hidden; } main { position: relative; z-index: 1; } img { vertical-align: bottom; max-width: 100%; height: auto; } svg { vertical-align: bottom; max-width: 100%; height: auto; } h1,h2,h3,h4,h5,p,dl,dt,dd{ margin: 0; } .m-plus-1p { font-family: 'M PLUS 1p', sans-serif; } p { line-height: 1.5em; } hr { } figure { margin: 0; } .thumbImage { height: auto; } .wp-pagenavi { margin-top: 60px; text-align: center; } .wp-pagenavi a:hover,.wp-pagenavi span.current{ background-color: #fcee21; opacity: 1; } .all-round-gothic { font-family: all-round-gothic, sans-serif; font-weight: 600; font-style: normal; } #wrap { display: none; } #loader-bg { display: none; position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: #fff; z-index: 999999; } #loader { display: none; position: relative; text-align: center; color: #fff; z-index: 1000000; } #loader img { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); transform: translate(-50%,-50%); } @media print, screen and (min-width: 751px) { .sp { display: none!important; } body { min-width: 1100px; font-size: 14px; } .master { width: 90%; max-width: 880px; margin: 0 auto; } a { -webkit-transition: .2s; transition: .2s; } a:hover { opacity: .6; } .wp-pagenavi a,.wp-pagenavi span{ margin: 0 2px; padding: 7px 10px; color: #000; display: inline-block; font-size: .9rem; } /*.wp-pagenavi .prevpostslink,.wp-pagenavi .nextpostslink{ padding: 9px 28px; }*/ .linkBtn { margin-top: 15px; padding-left: 67px; display: inline-block; position: relative; font-size: 1rem; } .linkBtn:hover { opacity: 1; } .linkBtn:before { content: ''; width: 48px; height: 48px; margin-right: 15px; background: url('../img/common/arrow-g.svg') 50% 50% no-repeat; display: block; border: 2px solid #7cc156; border-radius: 50%; -webkit-transition: .5s; transition: .5s; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0,-50%); transform: translate(0,-50%); } .linkBtn:hover:before { -webkit-transform: translate(0,-50%) scale(1.1); transform: translate(0,-50%) scale(1.1); background: #7cc156 url('../img/common/arrow-w.svg') 50% 50% no-repeat; border: 2px solid #7cc156; border-radius: 50%; } #header .master { width: 90%; max-width: 920px; margin: 0 auto; } #header .master .logo { margin-top: 20px; text-align: center; } #header .master #nav { margin-top: 15px; } #header .master #nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #header .master #nav ul li{ margin-right: 45px; text-align: center; } #header .master #nav ul li.showroom{ margin-right: 0; } #header .master #nav ul li.reservation{ width: 168px; margin-right: 0; margin-left: auto; } #header .master #nav ul li.reservation a{ height: 60px; line-height: 60px; background-color: #cb8e71; color: #fff; } #header .master #nav ul li.reservation a:hover,#header .master #nav ul li.reservation.current a{ background-color: #a24f32; } #header .master #nav ul li.contact{ width: 168px; margin-right: 0; margin-left: auto; } #header .master #nav ul li.contact a{ height: 60px; line-height: 60px; background-color: #7cc156; color: #fff; } #header .master #nav ul li.contact a:hover,#header .master #nav ul li.contact.current a{ background-color: #3c921d; } #header .master #nav ul li.reservation a:after,#header .master #nav ul li.contact a:after{ content: none; } #header .master #nav ul li.reservation a>span,#header .master #nav ul li.contact a>span{ position: relative; } #header .master #nav ul li.reservation a>span:after,#header .master #nav ul li.contact a>span:after{ content: ''; position: absolute; left: 0; bottom: -4px; width: 100%;height: 2px; background: #fff; -webkit-transform: scale(0, 1); transform: scale(0, 1);-webkit-transform-origin: left; transform-origin: left; -webkit-transition: 0.5s;transition: 0.5s; } #header .master #nav ul li.reservation a:hover>span:after,#header .master #nav ul li.contact a:hover>span:after,#header .master #nav ul li.current.reservation a>span:after,#header .master #nav ul li.current.contact a>span:after{ -webkit-transform: scale(1);transform: scale(1); } #header .master #nav ul li a{ font-size: .98rem; white-space: nowrap; display: block; position: relative; } #header .master #nav ul li a:after{ content: ''; position: absolute; left: 0; bottom: -4px; width: 100%;height: 2px; background: #7cc156; -webkit-transform: scale(0, 1); transform: scale(0, 1);-webkit-transform-origin: left; transform-origin: left; -webkit-transition: 0.3s; transition: 0.3s; } #header .master #nav ul li.current a:after,#header .master #nav ul li a:hover:after{ -webkit-transform: scale(1);transform: scale(1); } #header .master #nav ul li a:hover{ opacity: 1; } #f-header { width: 100%; position: fixed; top: -60px; left: 0; z-index: 5; background-color: #fff; -webkit-transition: .3s; transition: .3s; } #f-header.fixed { top: 0; } #f-header .master { width: 90%; max-width: 1200px; margin: 0 auto; } #f-header .master .logo { text-align: center; } #f-header .master .logo a:after{ content: none; } #f-header .master .logo a:hover{ opacity: .6; } #f-header .master nav { } #f-header .master nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #f-header .master nav ul li{ margin-right: 30px; text-align: center; } #f-header .master nav ul li.showroom{ } #f-header .master nav ul li.reservation{ width: 168px; margin-right: 0; } #f-header .master nav ul li.reservation a{ height: 60px; line-height: 60px; background-color: #cb8e71; color: #fff; } #f-header .master nav ul li.reservation a:hover,#f-header .master nav ul li.reservation.current a{ background-color: #a24f32; } #f-header .master nav ul li.contact{ width: 168px; margin-right: 0; } #f-header .master nav ul li.contact a{ height: 60px; line-height: 60px; background-color: #7cc156; color: #fff; } #f-header .master nav ul li.contact a:hover,#f-header .master nav ul li.contact.current a{ background-color: #3c921d; } #f-header .master nav ul li.reservation a:after,#f-header .master nav ul li.contact a:after{ content: none; } #f-header .master nav ul li.reservation a>span,#f-header .master nav ul li.contact a>span{ position: relative; } #f-header .master nav ul li.reservation a>span:after,#f-header .master nav ul li.contact a>span:after{ content: ''; position: absolute; left: 0; bottom: -4px; width: 100%;height: 2px; background: #fff; -webkit-transform: scale(0, 1); transform: scale(0, 1);-webkit-transform-origin: left; transform-origin: left; -webkit-transition: 0.5s;transition: 0.5s; } #f-header .master nav ul li.reservation a:hover>span:after,#f-header .master nav ul li.contact a:hover>span:after,#f-header .master nav ul li.current.reservation a>span:after,#f-header .master nav ul li.current.contact a>span:after{ -webkit-transform: scale(1);transform: scale(1); } #f-header .master nav ul li a{ font-size: .98rem; white-space: nowrap; display: block; position: relative; } #f-header .master nav ul li a:after{ content: ''; position: absolute; left: 0; bottom: -4px; width: 100%;height: 2px; background: #7cc156; -webkit-transform: scale(0, 1); transform: scale(0, 1);-webkit-transform-origin: left; transform-origin: left; -webkit-transition: 0.3s;transition: 0.3s; } #f-header .master nav ul li.current a:after,#f-header .master nav ul li a:hover:after{ -webkit-transform: scale(1);transform: scale(1); } #f-header .master nav ul li a:hover{ opacity: 1; } #main .title { padding-top: 30px; text-align: center; font-size: 2rem; background: url('../img/common/title-icon.svg') 50% 0 no-repeat; } #main .title span { margin-bottom: 15px; display: block; font-size: 1.2rem; color: #7cc156; } #main .subTitle { text-align: center; font-size: 1.8rem; } #main .subTitle span { margin-bottom: 15px; display: block; font-size: 1.2rem; color: #7cc156; } .mainImage { width: 100%; margin-top: 79px; height: 280px; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; } .mainImage:before { content: ''; width: 4px; height: 50px; background-color: #7cc156; position: absolute; top: -25px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); } .mainImage p { font-size: 1.3rem; line-height: 2; font-weight: 700; color: #fff; } #footer { margin-top: 183px; padding-bottom: 35px; } #footer .master { max-width: 950px; } #footer #pagetop { position: fixed; bottom: 20px; right: 20px; z-index: 9; } #footer #pagetop a { display: block; -webkit-transition: .5s; transition: .5s; } #footer #pagetop a:hover{ opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } #footer .logo { text-align: center; } #footer .footerNav { max-width: 750px; margin: 50px auto 0; } #footer .footerNav>ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } #footer .footerNav>ul>li{ width: 25%; } #footer .footerNav>ul>li:nth-of-type(n+5){ margin-top: 45px; } #footer .footerNav>ul>li a{ font-size: 1rem; line-height: 1.9; } #footer .footerNav>ul>li>ul li a{ color: #666; } #footer .info { margin-top: 50px; display: -webkit-box; display: -ms-flexbox; display: flex; } #footer .info>dl:nth-of-type(1){ width: 60%; } #footer .info>dl:nth-of-type(2){ width: 35%; margin-left: auto; } #footer .info>dl>div { height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #footer .info>dl>div dt { padding: 10px 0; font-size: .95rem; font-weight: 700; text-align: center; } #footer .info>dl>div dt img{ margin-bottom: 10px; display: block; } #footer .info>dl>div dd { height: 100%; margin-left: 25px; padding: 10px 0; padding-left: 25px; border-left: 1px solid #000; font-size: .95rem; } #footer .info>dl:nth-of-type(2) dd p:nth-of-type(1){ padding-top: 14px; } #footer .bNav { margin-top: 53px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } #footer .bNav li:nth-of-type(1){ margin-right: 35px; } #footer .bNav li a { font-size: .9rem } #footer .copyright { margin-top: 35px; text-align: center; color: #666; } #main.confirm { margin-top: 80px; padding-bottom: 50px; } #main.confirm .topText { margin-top: 50px; } #main.confirm dl { margin-top: 10px; } #main.confirm dl>div { border: 1px solid #ccc; display: -webkit-box; display: -ms-flexbox; display: flex; } #main.confirm dl>div:nth-of-type(n+2){ border-top: 0; } #main.confirm dl>div dt{ width: 200px; padding: 15px; font-weight: 700; background-color: #efefef; } #main.confirm dl>div dd{ width: calc(100% - 200px); padding: 15px; border-left: 1px solid #ccc; } #main.confirm ul { width: 100%; max-width: 650px; margin: 50px auto 0; display: -webkit-box; display: -ms-flexbox; display: flex; } #main.confirm ul li { width: 100%; } #main.confirm ul li:last-of-type{ margin-left: 50px; } #main.confirm ul li .returnBtn{ width: 100%; height: 60px; display: block; border-radius: 45px; border: 2px solid #ccc; background: #fff; font-size: 1rem; font-weight: 700; color: #000; cursor: pointer; -webkit-transition: .5s; transition: .5s; } #main.confirm ul li .returnBtn:hover { background: #efefef; color: #000; } #main.confirm ul li .subBtn{ width: 100%; height: 60px; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url('../img/common/arrow-btn.svg') 41px 50% no-repeat; font-size: 1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; } #main.confirm ul li .subBtn:hover { background: #7cc156 url('../img/common/arrow-btn-hover.svg') 41px 50% no-repeat; color: #fff; } #thanks { margin-top: 80px; text-align: center; } #thanks .bText { margin: 90px 0 35px; font-size: 1.75rem; font-weight: 700; } #thanks p { margin-top: 10px; } #thanks .btn { width: 90%; max-width: 450px; height: 90px; margin: 195px auto 0; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url('../img/common/arrow-btn.svg') 41px 50% no-repeat; font-size: 1.1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; line-height: 90px; } #thanks .btn:hover { opacity: 1; background: #7cc156 url('../img/common/arrow-btn-hover.svg') 41px 50% no-repeat; color: #fff; } #reservationContact { height: 570px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: url('../img/top/reservation-contact-bg.jpg') 50% 50% no-repeat; background-size: cover; } #reservationContact .master{ max-width: 940px; text-align: center; color: #fff; } #reservationContact .title{ margin-bottom: 30px; } #reservationContact p { font-size: .95rem; line-height: 1.9; } #reservationContact ul { display: -webkit-box; display: -ms-flexbox; display: flex; } #reservationContact ul li{ width: 48%; } #reservationContact ul li:nth-of-type(1){ } #reservationContact ul li:nth-of-type(1) a{ width: 100%; max-width: 450px; height: 90px; margin: 58px auto 0; display: block; border-radius: 45px; border: 2px solid #cb8e71; background: #fff url(../img/common/arrow-btn-b.svg) 41px 50% no-repeat; font-size: 1.1rem; font-weight: 700; color: #cb8e71; cursor: pointer; -webkit-transition: .5s; transition: .5s; line-height: 90px; } #reservationContact ul li:nth-of-type(1) a:hover{ opacity: 1; background: #cb8e71 url(../img/common/arrow-btn-hover.svg) 41px 50% no-repeat; color: #fff; } #reservationContact ul li:nth-of-type(2){ margin-left: auto; } #reservationContact ul li:nth-of-type(2) a{ width: 100%; max-width: 450px; height: 90px; margin: 58px auto 0; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url(../img/common/arrow-btn.svg) 41px 50% no-repeat; font-size: 1.1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; line-height: 90px; } #reservationContact ul li:nth-of-type(2) a:hover{ opacity: 1; background: #7cc156 url(../img/common/arrow-btn-hover.svg) 41px 50% no-repeat; color: #fff; } } @media screen and (max-width: 1200px) and (min-width: 751px) { #f-header .master nav ul li{ margin-right: 20px; } #f-header .master nav ul li.reservation{ width: 155px; } #f-header .master nav ul li.contact{ width: 155px; } } @media screen and (max-width: 1000px) and (min-width: 751px) { } @media screen and (max-width: 750px) { .pc { display: none!important; } body { font-weight: 500; font-size: 14px; } .drawer-open body { overflow: hidden!important; } .master { width: 90%; margin: 0 auto; } #loader img { width: 200px; } .wp-pagenavi a,.wp-pagenavi span{ margin: 0; padding: 5px 8px; color: #000; display: inline-block; font-size: .8rem; } /*.wp-pagenavi .prevpostslink,.wp-pagenavi .nextpostslink{ padding: 7px 15px; }*/ .linkBtn { margin-top: 15px; padding-left: 55px; display: inline-block; position: relative; font-size: 1rem; } .linkBtn:hover { opacity: 1; } .linkBtn:before { content: ''; width: 36px; height: 36px; margin-right: 15px; background: url('../img/common/arrow-g.svg') 50% 50% no-repeat; display: block; border: 2px solid #7cc156; border-radius: 50%; -webkit-transition: .5s; transition: .5s; position: absolute; top: 50%; left: 0; -webkit-transform: translate(0,-50%); transform: translate(0,-50%); } .linkBtn:hover:before { -webkit-transform: translate(0,-50%) scale(1.1); transform: translate(0,-50%) scale(1.1); background: #7cc156 url('../img/common/arrow-w.svg') 50% 50% no-repeat; border: 2px solid #7cc156; border-radius: 50%; } .drawer-hamburger-icon, .drawer-hamburger-icon:after, .drawer-hamburger-icon:before{ background-color: #000; } .drawer-hamburger { top: 9px; z-index: 99999; } .drawer-hamburger-icon { } .drawer-open .drawer-overlay{ display: none; } .drawer-nav { top: -100%; left: 0; background-color: transparent; z-index: 10001; } .drawer-open .drawer-nav{ top: 0; left: 0; } .drawer-menu li a { } .drawer-menu>li:first-of-type{ padding: 0; } .drawer-menu>li:last-of-type{ padding-bottom: 50px; } #header .drawer-menu-item{ margin: 10px 0; padding: 15px 50px; color: #000; text-align: center; font-weight: 400; display: block; font-weight: 700; } #header .drawer-menu-item:hover{ opacity: .6; text-decoration: none; } .drawer-nav{ height: 100vh; background-color: transparent; -webkit-transition: .5s; transition: .5s; } .drawer-open .drawer-nav{ background-color: #fff; } .drawer-open .drawer-hamburger-icon:after, .drawer-open .drawer-hamburger-icon:before{ top: 0; } #header .logo .drawer-menu-item{ padding: 0; } #header #nav .logo { margin-bottom: 20px; } #header { height: 90px; position: static; z-index: 5; } #header .master { position: relative; } #header .logo { width: 144px; margin: 12px auto 0; text-align: center; } #header #nav { } #header #nav ul { width: 100%; max-width: 1000px; margin: 0 auto; } #header #nav ul li { text-align: center; } #header #nav ul li:first-of-type{ } #header #nav ul li.logo a{ margin: 0; padding: 0; } #header #nav ul li a { margin: 10px 0; padding: 5px 5px; display: inline-block; font-size: .95rem; } #header #nav ul li>ul li{ text-align: center; } #header #nav ul li>ul li a{ margin: 0; padding: 5px 5px; color: #4d4d4d; font-size: .9rem; } #header #nav ul li.reservation{ width: 80%; margin: 10px auto; } #header #nav ul li.reservation a{ height: 60px; margin: 0; padding: 0; line-height: 60px; display: block; font-size: .8rem; background: #cb8e71 url('../img/common/arrow-btn-hover.svg') 20px 50% no-repeat; background-size: 6px; border-radius: 30px; color: #fff; } #header #nav ul li.reservation a>span{ } #header #nav ul li.contact{ width: 80%; margin: 10px auto; } #header #nav ul li.contact a{ height: 60px; margin: 0; padding: 0; line-height: 60px; display: block; font-size: .8rem; background: #7cc156 url('../img/common/arrow-btn-hover.svg') 20px 50% no-repeat; background-size: 6px; border-radius: 30px; color: #fff; } #header #nav ul li.contact a>span{ } #header #nav ul.bNav { margin-top: 20px; } #header #nav ul.bNav li a{ margin: 3px 0; font-size: .8rem; } #header .info { width: 90%; margin: 30px auto 0; } #header .info:after { content: ''; width: 100%; height: 30px; display: block; } #header .info>dl { } #header .info>dl:nth-of-type(n+2){ margin-top: 20px; } #header .info>dl>div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #header .info>dl>div dt { width: 120px; padding: 10px 0; padding-right: 10px; font-size: .85rem; font-weight: 700; text-align: right; line-height: 1.5; } #header .info>dl>div dt img{ margin-bottom: 5px; display: block; } #header .info>dl>div dd { width: calc(100% - 120px); padding: 10px 0; padding-left: 10px; border-left: 1px solid #000; font-size: .85rem; } #main .title { padding-top: 15px; text-align: center; font-size: 1.5rem; background: url('../img/common/title-icon.svg') 50% 0 no-repeat; background-size: 47px; } #main .title span { margin-bottom: 10px; display: block; font-size: 1rem; color: #7cc156; } #main .subTitle { text-align: center; font-size: 1.3rem; } #main .subTitle span { margin-bottom: 15px; display: block; font-size: 1rem; color: #7cc156; } .mainImage { width: 100%; margin-top: 50px; height: 182px; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; } .mainImage:before { content: ''; width: 2px; height: 32px; background-color: #7cc156; position: absolute; top: -16px; left: 50%; -webkit-transform: translate(-50%,0); transform: translate(-50%,0); } .mainImage p { font-size: .95rem; line-height: 2; font-weight: 700; color: #fff; } #footer { margin-top: 100px; padding-bottom: 35px; } #footer #pagetop { width: 45px; position: fixed; bottom: 20px; right: 20px; z-index: 9; } #footer #pagetop a { display: block; -webkit-transition: .5s; transition: .5s; } #footer #pagetop a:hover{ opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1); } #footer .logo { text-align: center; } #footer .logo img { width: 144px; } #footer .footerNav { width: 100%; max-width: 750px; margin: 20px auto 0; } #footer .footerNav>ul { } #footer .footerNav>ul>li{ text-align: center } #footer .footerNav>ul>li:nth-of-type(n+5){ } #footer .footerNav>ul>li a{ margin: 10px 0; padding: 5px 5px; font-size: .95rem; display: inline-block; } #footer .footerNav>ul>li>ul li a{ margin: 0; padding: 5px 5px; font-size: .9rem; color: #666; } #footer .footerNav>ul li.reservation{ width: 90%; margin: 10px auto; } #footer .footerNav>ul li.reservation a{ height: 60px; margin: 0; padding: 0; line-height: 60px; display: block; font-size: .8rem; background: #cb8e71 url('../img/common/arrow-btn-hover.svg') 20px 50% no-repeat; background-size: 6px; border-radius: 30px; color: #fff; } #footer .footerNav>ul li.reservation a>span{ } #footer .footerNav>ul li.contact{ width: 90%; margin: 10px auto; } #footer .footerNav>ul li.contact a{ height: 60px; margin: 0; padding: 0; line-height: 60px; display: block; font-size: .8rem; background: #7cc156 url('../img/common/arrow-btn-hover.svg') 20px 50% no-repeat; border-radius: 30px; color: #fff; background-size: 6px; } #footer .footerNav>ul li.contact a>span{ } #footer .info { width: 100%; margin: 30px auto 0; } #footer .info:after { content: ''; width: 100%; height: 30px; display: block; } #footer .info>dl { } #footer .info>dl:nth-of-type(n+2){ margin-top: 20px; } #footer .info>dl>div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } #footer .info>dl>div dt { width: 120px; padding: 10px 0; padding-right: 10px; font-size: .85rem; font-weight: 700; text-align: right; line-height: 1.5; } #footer .info>dl>div dt img{ margin-bottom: 5px; display: block; } #footer .info>dl>div dd { width: calc(100% - 120px); padding: 10px 0; padding-left: 10px; border-left: 1px solid #000; font-size: .85rem; } #footer .bNav { margin-top: 20px; } #footer .bNav li { text-align: center; } #footer .bNav li a { margin: 3px; padding: 5px 5px; display: inline-block; font-size: .8rem } #footer .copyright { margin-top: 35px; text-align: center; color: #666; } #footer .master { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } #footer .master>.logo { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } #footer .master>.footerNav{ -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } #footer .master>.info { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4; } #footer .master>.bNav { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } #footer .master>.copyright{ -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5; } #main.confirm { margin-top: 0; padding-bottom: 50px; } #main.confirm .topText { margin-top: 30px; } #main.confirm dl { margin-top: 10px; } #main.confirm dl>div { border: 1px solid #ccc; } #main.confirm dl>div:nth-of-type(n+2){ border-top: 0; } #main.confirm dl>div dt{ padding: 10px; font-weight: 700; background-color: #efefef; } #main.confirm dl>div dd{ padding: 10px; border-top: 1px solid #ccc; } #main.confirm ul { width: 80%; max-width: 650px; margin: 30px auto 0; } #main.confirm ul li { width: 100%; } #main.confirm ul li:last-of-type{ } #main.confirm ul li .returnBtn{ width: 90%; height: 60px; display: block; border-radius: 45px; border: 2px solid #ccc; background: #fff; font-size: 1rem; font-weight: 700; color: #000; cursor: pointer; -webkit-transition: .5s; transition: .5s; } #main.confirm ul li .returnBtn:hover { background: #efefef; color: #000; } #main.confirm ul li .subBtn{ width: 90%; height: 60px; margin-top: 15px; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url('../img/common/arrow-btn.svg') 41px 50% no-repeat; font-size: 1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; } #main.confirm ul li .subBtn:hover { background: #7cc156 url('../img/common/arrow-btn-hover.svg') 41px 50% no-repeat; color: #fff; } #thanks { margin-top: 50px; text-align: center; } #thanks .bText { margin: 40px 0 25px; font-size: 1rem; font-weight: 700; } #thanks p { } #thanks .btn { width: 90%; max-width: 450px; height: 60px; margin: 80px auto 0; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #fff url('../img/common/arrow-btn.svg') 41px 50% no-repeat; font-size: 1rem; font-weight: 700; color: #7cc156; cursor: pointer; -webkit-transition: .5s; transition: .5s; line-height: 60px; } #thanks .btn:hover { opacity: 1; background: #7cc156 url('../img/common/arrow-btn-hover.svg') 41px 50% no-repeat; color: #fff; } #reservationContact { margin-top: 100px; height: 570px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: url('../img/top/reservation-contact-bg.jpg') 50% 50% no-repeat; background-size: cover; } #reservationContact .master{ max-width: 940px; text-align: center; color: #fff; } #reservationContact .title{ margin-bottom: 30px; } #reservationContact p { font-size: .85rem; line-height: 1.8; text-align: justify; } #reservationContact ul { margin-top: 30px; } #reservationContact ul li{ width: 100%; } #reservationContact ul li:nth-of-type(1){ } #reservationContact ul li:nth-of-type(1) a{ width: 100%; max-width: 450px; height: 60px; margin: 0 auto 0; display: block; border-radius: 45px; border: 2px solid #cb8e71; background: #cb8e71 url(../img/common/arrow-btn-hover.svg) 41px 50% no-repeat; font-size: .85rem; font-weight: 700; color: #fff; cursor: pointer; -webkit-transition: .5s; transition: .5s; line-height: 60px; background-size: 6px; } /*#reservationContact ul li:nth-of-type(1) a:hover{ opacity: 1; background: #cb8e71 url(../img/common/arrow-btn-hover.svg) 41px 50% no-repeat; color: #fff; }*/ #reservationContact ul li:nth-of-type(2){ margin-top: 20px; } #reservationContact ul li:nth-of-type(2) a{ width: 100%; max-width: 450px; height: 60px; margin: 0 auto 0; display: block; border-radius: 45px; border: 2px solid #7cc156; background: #7cc156 url(../img/common/arrow-btn-hover.svg) 41px 50% no-repeat; font-size: .85rem; font-weight: 700; color: #fff; cursor: pointer; -webkit-transition: .5s; transition: .5s; line-height: 60px; background-size: 6px; } /*#reservationContact ul li:nth-of-type(2) a:hover{ opacity: 1; background: #7cc156 url(../img/common/arrow-btn-hover.svg) 41px 50% no-repeat; color: #fff; }*/ }