@charset "UTF-8";
/** html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) Richard Clark (http://richclarkdesign.com) http://cssreset.com */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; -webkit-box-sizing: border-box; box-sizing: border-box; }

body { line-height: 1; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

nav ul { list-style: none; }

blockquote, q { quotes: none; }

blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }

a { margin: 0; padding: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

/* change colours to suit your needs */
ins { background-color: #ff9; color: #000; text-decoration: none; }

/* change colours to suit your needs */
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }

del { text-decoration: line-through; }

abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }

table { border-collapse: collapse; border-spacing: 0; }

/* change border colour to suit your needs */
hr { display: block; height: 1px; border: 0; border-top: 1px solid #cccccc; margin: 1em 0; padding: 0; }

input, select { vertical-align: middle; }

.glb_footer { clear: both; }

.glb_footer::after { display: block; clear: both; height: 0; overflow: hidden; content: ''; }

@media (min-width: 601px) { .glb_footer { background: #e3ebd0; } }

@media (max-width: 959px) { .glb_footer { position: absolute; z-index: 100; top: 0; width: 100%; min-height: 100%; margin-top: 0; padding: 30px; background: rgba(0, 0, 0, 0.9); -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: -webkit-transform .6s; transition: -webkit-transform .6s; -o-transition: transform .6s; transition: transform .6s; transition: transform .6s, -webkit-transform .6s; }
  .menu_open .glb_footer { -webkit-transform: translateX(0); -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); } }

.glb_footer a { text-decoration: none; color: #fff; }

@media (max-width: 600px) { .glb_footer a { font-size: 0.88em; font-size: 4.375vw; } }

@media (min-width: 360px) { .glb_footer a { font-size: 0.88em; font-size: 2.91667vw; } }

@media (min-width: 601px) { .glb_footer a { font-size: 0.88em; } }

@media (min-width: 960px) { .glb_footer a { color: #014208; } }

@media (min-width: 960px) { .glb_footer h2 { float: left; } }

@media (max-width: 959px) { .glb_footer h2 { padding-bottom: 0.6em; } }

.glb_footer ul { list-style-type: none; }

@media (min-width: 960px) { .glb_footer ul { float: left; width: 20%; }
  .glb_footer ul:nth-of-type(1) { margin-left: 2em; } }

@media (min-width: 1200px) { .glb_footer ul { width: 165px; }
  .glb_footer ul:nth-of-type(2) { width: 235px; } }

@media (max-width: 959px) { .glb_footer li { padding-bottom: 1em; } }

@media (min-width: 601px) { .glb_footer li { padding-bottom: 1em; }
  .glb_footer li.for_sp { display: none; } }

.glb_footer .cbox { position: relative; }

@media (min-width: 601px) { .glb_footer .cbox { width: 100%; padding: 35px 0 35px 0.8%; } }

@media (min-width: 1200px) { .glb_footer .cbox { width: 1200px; margin: 0 auto; height: 282px; padding: 35px 0 0 120px; } }

.glb_footer .cbox:after { display: block; clear: both; overflow: hidden; height: 0; content: ''; }

.glb_footer .copyright { position: absolute; bottom: 2px; right: 5px; }

/*
@
@ font settings
@
*/
@font-face { font-family: "Yu Gothic M"; font-style: normal; font-weight: 400; src: local("Yu Gothic-Medium"), local("Yu Gothic Medium"), local("YuGothic-Regular"); /* 游ゴシックMediumが存在しないWindows8.1用 */ }

@font-face { font-family: "Yu Gothic M"; font-style: normal; font-weight: 700; src: local("YuGothic-Bold"), local("Yu Gothic"); /* PostScript Nameを認識できないChrome用にFull Nameを指定 */ }

body, html { height: 100%; font-family: Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic M" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" ,sans-serif; -webkit-font-smoothing: antialiased; -webkit-font-featuer-settings: "palt" 1; -webkit-font-feature-settings: "palt" 1; font-feature-settings: "palt" 1; color: #212121; -webkit-text-size-adjust: 100%; }

a { text-decoration: none; color: #36ab43; }

a:hover { color: #6fde7c; }

#wrapper { width: 100%; position: relative; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; overflow-x: hidden; }

@media (min-width: 600px) { .no_pc { display: none; } }

@media (max-width: 599px) { .no_sp { display: none; } }

.glb-head { position: relative; z-index: 100; height: 76px; width: 100%; }

.glb-head::before { position: absolute; display: block; left: 0; bottom: -48px; bottom: -7.196vmax; width: 100%; height: 48px; height: 7.196vmax; content: ''; background-image: url(../img/m-visual-cover.svg); background-size: 102% auto; background-repeat: no-repeat; background-position: 50% 100%; border-bottom-left-radius: 100%; border-bottom-right-radius: 100%; }

@media (min-width: 960px) { .glb-head::before { width: 100%; bottom: -28px; height: 30px; margin: 0 auto; } }

@media (min-width: 960px) { .glb-head { height: 70px; } }

.glb-head .cbox { position: relative; width: 100%; padding: 0 1.66667%; }

@media (min-width: 1200px) { .glb-head .cbox { width: 1200px; margin: 0 auto; padding: 0 15px; } }

.glb-head .glb-logo { top: 6px; left: 50%; width: 55%; width: 55vmin; margin: 0 auto 4px; padding-top: 6px; }

@media (min-width: 601px) { .glb-head .glb-logo { width: 200px; } }

@media (min-width: 960px) { .glb-head .glb-logo { position: absolute; left: 15px; right: auto; margin: 0; padding: 0; } }

.glb-head .glb-logo img { width: 100%; height: auto; }

.glb-head .page-title { width: 100%; left: 0; font-size: 0.88rem; font-size: 3.33333vw; text-align: center; color: #436918; }

@media (min-width: 601px) { .glb-head .page-title { font-size: 1rem; } }

@media (min-width: 960px) { .glb-head .page-title { position: absolute; top: 22px; font-size: 0.81rem; } }

.glb-head .page-title img { display: block; width: 45%; width: 45vmin; height: auto; margin: 0 auto 5px; }

@media (min-width: 601px) { .glb-head .page-title img { height: auto; width: 190px; } }

@media (min-width: 960px) { .glb-head .page-title img { width: 230px; height: auto; } }

.glb-head .navi-list { display: none; }

@media (min-width: 960px) { .glb-head .navi-list { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: 0; right: 1.25%; } }

.glb-head .navi-list li { position: relative; background-position: 0 0; background-repeat: no-repeat; background-size: cover; -webkit-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -webkit-transform: translateY(-3px) rotate(0deg); -ms-transform: translateY(-3px) rotate(0deg); transform: translateY(-3px) rotate(0deg); -webkit-transition: -webkit-transform .2s; transition: -webkit-transform .2s; -o-transition: transform .2s; transition: transform .2s; transition: transform .2s, -webkit-transform .2s; }

@media (min-width: 960px) { .glb-head .navi-list li { width: 98px; height: 30px; } }

@media (min-width: 1200px) { .glb-head .navi-list li { width: 114px; height: 35px; } }

.glb-head .navi-list li:nth-of-type(-n+2) { margin-right: 16px; }

.glb-head .navi-list li:nth-of-type(1) { background-image: url(../img/link-navi-bg_home.png); }

.glb-head .navi-list li:nth-of-type(2) { background-image: url(../img/link-navi-bg_docreq.png); }

.glb-head .navi-list li:nth-of-type(3) { background-image: url(../img/link-navi-bg_visit.png); }

.glb-head .navi-list li:hover { -webkit-transform: translateY(0) rotate(5deg); -ms-transform: translateY(0) rotate(5deg); transform: translateY(0) rotate(5deg); }

.glb-head .navi-list a { display: block; width: 100%; height: 100%; padding-top: 7px; font-weight: 700; text-align: center; line-height: 1.25; color: #555; }

@media (min-width: 601px) { .glb-head .navi-list a { font-size: 0.88rem; } }

@media (min-width: 1200px) { .glb-head .navi-list a { font-size: 1rem; } }

.toggle_navi { position: absolute; top: 0px; right: 0.86%; z-index: 99999; width: 54px; height: 54px; bottom: 0px; }

@media (min-width: 960px) { .toggle_navi { display: none; } }

.toggle_navi .menu_text { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 100%; padding-top: 72%; position: absolute; font-size: 0.75rem; text-align: center; color: #444; -webkit-transition: color .4s; -o-transition: color .4s; transition: color .4s; }

.toggle_navi .menu_text::after { display: block; position: absolute; width: 60%; top: 45%; height: 3px; margin: 0 20%; border-radius: 1.5px; background: #666; content: ''; -webkit-transition: -webkit-transform .4s,-webkit-opacity .4s .2s; -webkit-transition: opacity .4s .6s,-webkit-transform .4s; transition: opacity .4s .6s,-webkit-transform .4s; -o-transition: transform .4s,opacity .4s .6s; transition: transform .4s,opacity .4s .6s; transition: transform .4s,opacity .4s .6s,-webkit-transform .4s; }

.toggle_navi::after, .toggle_navi::before { display: block; position: absolute; width: 60%; height: 3px; margin: 0 20%; border-radius: 1.5px; background: #666; content: ''; -webkit-transition: -webkit-transform .4s .2s,background .4s .2s,top 0s .2s; -webkit-transition: background .4s,top .4s .4s,-webkit-transform .4s .4s; transition: background .4s,top .4s .4s,-webkit-transform .4s .4s; -o-transition: transform .4s .4s,background .4s,top .4s .4s; transition: transform .4s .4s,background .4s,top .4s .4s; transition: transform .4s .4s,background .4s,top .4s .4s,-webkit-transform .4s .4s; }

.toggle_navi::before { top: 29%; }

.toggle_navi::after { top: 62%; }

.toggle_navi.active .menu_text { color: #fff; }

.toggle_navi.active .menu_text::after { -webkit-opacity: 0; opacity: 0; -webkit-transition: -webkit-transform .4s .4s,-webkit-opacity .1s; -webkit-transition: opacity .1s,-webkit-transform .4s .4s; transition: opacity .1s,-webkit-transform .4s .4s; -o-transition: transform .4s .4s,opacity .1s; transition: transform .4s .4s,opacity .1s; transition: transform .4s .4s,opacity .1s,-webkit-transform .4s .4s; }

.toggle_navi.active::before, .toggle_navi.active::after { -webkit-transition: -webkit-transform .4s,background .4s,top 0s; -webkit-transition: background .4s,top 0s,-webkit-transform .4s; transition: background .4s,top 0s,-webkit-transform .4s; -o-transition: transform .4s,background .4s,top 0s; transition: transform .4s,background .4s,top 0s; transition: transform .4s,background .4s,top 0s,-webkit-transform .4s; }

.toggle_navi.active::after { top: 40%; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; background: #fff; }

.toggle_navi.active::before { top: 40%; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: 50%; -ms-transform-origin: 50%; transform-origin: 50%; background: #fff; }

.main-visual { position: relative; z-index: 2; overflow: hidden; width: 100%; }

.main-visual .section-header { position: absolute; bottom: 0; z-index: 3; width: 100%; height: 20vmax; background: rgba(0, 0, 0, 0.5); }

@media (min-width: 960px) { .main-visual .section-header { height: 208px; height: 17.33333vw; } }

@media (min-width: 1200px) { .main-visual .section-header { height: 188px; } }

.main-visual .section-header img { width: 100%; height: auto; }

.main-visual .section-title { width: 90%; width: 90vmin; margin: 0 auto; padding-top: 15px; }

@media (min-width: 601px) { .main-visual .section-title { width: 60%; } }

@media (min-width: 960px) { .main-visual .section-title { width: 527px; width: 43.91667vw; } }

@media (min-width: 1200px) { .main-visual .section-title { width: 527px; padding-top: 30px; } }

.main-visual .logo-white { position: absolute; bottom: 2px; right: 15px; width: 30%; width: 30vmin; }

@media (min-width: 601px) { .main-visual .logo-white { width: 18%; bottom: 8px; } }

@media (min-width: 960px) { .main-visual .logo-white { width: 169px; width: 14.08333vw; bottom: 14px; } }

@media (min-width: 1200px) { .main-visual .logo-white { width: 169px; } }

.main-visual .slider li { width: 100%; height: 64vmax; overflow: hidden; }

@media (min-width: 960px) { .main-visual .slider li { height: 50.83333vw; } }

@media (min-width: 1200px) { .main-visual .slider li { height: 610px; } }

.main-visual .slider img { position: absolute; top: 0; left: 50%; width: auto; height: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); -webkit-transition: -webkit-transform 2s; transition: -webkit-transform 2s; -o-transition: transform 2s; transition: transform 2s; transition: transform 2s, -webkit-transform 2s; }

@media (min-width: 960px) { .main-visual .slider img { top: 50%; -webkit-transform: translate(-50%, -50%) scale(1); -ms-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); width: 100%; height: auto; } }

.main-visual .slider .zoom img { -webkit-transform: translateX(-50%) scale(1.15); -ms-transform: translateX(-50%) scale(1.15); transform: translateX(-50%) scale(1.15); -webkit-transition: -webkit-transform 30s ease-out; transition: -webkit-transform 30s ease-out; -o-transition: transform 30s ease-out; transition: transform 30s ease-out; transition: transform 30s ease-out, -webkit-transform 30s ease-out; }

@media (min-width: 960px) { .main-visual .slider .zoom img { -webkit-transform: translate(-50%, -50%) scale(1.2); -ms-transform: translate(-50%, -50%) scale(1.2); transform: translate(-50%, -50%) scale(1.2); } }

.main-visual .fade-in-obj { opacity: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: transform,opacity; transition-property: transform,opacity; transition-property: transform,opacity,-webkit-transform; -webkit-transition-duration: 1.2s, .4s; -o-transition-duration: 1.2s, .4s; transition-duration: 1.2s, .4s; }

.main-visual .fade-in-obj.current { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-delay: 0s,0s; -o-transition-delay: 0s,0s; transition-delay: 0s,0s; -webkit-transition-duration: 1.2s, 2.0s; -o-transition-duration: 1.2s, 2.0s; transition-duration: 1.2s, 2.0s; }

.main-visual .read-text { position: absolute; top: 35%; width: 100%; padding: 0 4%; text-align: center; color: #fff; font-size: 0.94rem; font-weight: 700; line-height: 1.4; }

@media (min-width: 601px) { .main-visual .read-text { font-size: 1.5rem; } }

@media (min-width: 1200px) { .main-visual .read-text { top: 89px; } }

.introduction { background-image: url(../img/intro-bg.jpg); background-repeat: no-repeat; background-size: cover; }

.introduction::after { display: block; clear: both; height: 0; overflow: hidden; content: ''; }

.introduction .cbox { position: relative; padding: 20px 5%; }

@media (min-width: 960px) { .introduction .cbox { padding-bottom: 60px; } }

@media (min-width: 1200px) { .introduction .cbox { width: 1200px; margin: 0 auto; } }

.introduction .section-title, .introduction .text { color: #555; margin-bottom: 1em; }

.introduction .section-title { font-size: 1.13rem; text-align: center; }

@media (min-width: 960px) { .introduction .section-title { font-size: 1.38rem; margin-bottom: 1.4em; } }

.introduction .text { font-size: 1rem; color: #555; line-height: 2.0; }

@media (min-width: 960px) { .introduction .text { font-size: 1.66667vw; } }

@media (min-width: 1200px) { .introduction .text { font-size: 1.13rem; } }

@media (min-width: 960px) { .introduction .text-box { width: 48%; float: left; margin-right: 3%; padding-top: 12px; } }

@media (min-width: 601px) { .introduction .photo-box { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: top; -ms-flex-align: top; align-items: top; } }

@media (min-width: 960px) { .introduction .photo-box { display: inline-block; width: 48%; } }

.introduction .photo { width: 100%; margin-bottom: 12px; }

@media (min-width: 601px) { .introduction .photo { width: 48%; }
  .introduction .photo:nth-of-type(2n+1) { margin-right: 4%; } }

@media (min-width: 960px) { .introduction .photo { width: 100%; }
  .introduction .photo:nth-of-type(2) { position: absolute; width: 40%; bottom: 0; left: 5%; } }

.introduction .photo img { width: 100%; height: auto; }

.four-point > .section-header { position: relative; width: 100%; background-image: url(../img/4point_bg.jpg); background-repeat: no-repeat; background-position: 50% 100%; background-size: auto 100%; padding: 20px 5%; }

@media (min-width: 601px) { .four-point > .section-header { background-size: cover; background-attachment: fixed; background-position: 50% 100%; } }

.four-point h2 { margin-bottom: 1em; padding: 0 1.8rem; font-size: 1rem; color: #666; text-align: center; line-height: 1.4; }

.four-point h2 br { display: none; }

@media (min-width: 601px) { .four-point h2 br { display: inline; } }

@media (min-width: 601px) { .four-point h2 { font-size: 1.13rem; } }

@media (min-width: 601px) { .four-point .ancher-navi { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } }

@media (min-width: 960px) { .four-point .ancher-navi { width: 606px; margin: 0 auto; } }

.four-point .ancher-link { width: 75%; margin: 0 auto 2px; }

@media (min-width: 601px) { .four-point .ancher-link { width: 49%; } }

@media (min-width: 960px) { .four-point .ancher-link { width: 298px; } }

.four-point .ancher-link img { width: 100%; height: auto; -webkit-transition: opacity .6s 0s,-webkit-transform .4s 0s; transition: opacity .6s 0s,-webkit-transform .4s 0s; -o-transition: transform .4s 0s,opacity .6s 0s; transition: transform .4s 0s,opacity .6s 0s; transition: transform .4s 0s,opacity .6s 0s,-webkit-transform .4s 0s; }

.four-point .ancher-link img:hover { opacity: .6; -webkit-transform: translateY(2px); -ms-transform: translateY(2px); transform: translateY(2px); }

.four-point-section { position: relative; background-repeat: no-repeat; background-size: cover; background-position: 50% 50%; }

@media (min-width: 960px) { .four-point-section { height: 611px; } }

@media (min-width: 1200px) { .four-point-section { width: 1200px; margin: 0 auto; } }

.four-point-section .cbox { padding: 20px 5%; }

@media (min-width: 960px) { .four-point-section .cbox { width: 50%; height: 100%; padding: 28px 32px; } }

.four-point-section .sub-title { display: block; font-size: 0.88rem; }

.four-point-section .section-header { margin-bottom: 1.2em; }

@media (min-width: 960px) { .four-point-section .section-header { margin-bottom: 34px; } }

.four-point-section .section-header p { line-height: 1.4; }

.four-point-section .section-title { font-size: 1.13rem; text-align: center; margin-bottom: 1em; line-height: 1.4; }

@media (min-width: 960px) { .four-point-section .section-title { font-size: 1.75rem; text-align: left; margin-bottom: 10px; line-height: 1.25; } }

.four-point-section .text { margin-bottom: 1.5em; line-height: 1.6; }

.four-point-section .to_menu { text-align: center; -webkit-backface-visibility: hidden; backface-visibility: hidden; -webkit-transition: -webkit-transform .2s; transition: -webkit-transform .2s; -o-transition: transform .2s; transition: transform .2s; transition: transform .2s, -webkit-transform .2s; margin: 1em 0; }

@media (min-width: 960px) { .four-point-section .to_menu { text-align: center; margin: 0; } }

.four-point-section .to_menu:hover { -webkit-transform: translateY(-5px); -ms-transform: translateY(-5px); transform: translateY(-5px); }

.four-point-section.natural { background-image: url(../img/4point-box_bg_sp_01.jpg); background-color: #000; }

@media (min-width: 960px) { .four-point-section.natural { background-image: url(../img/4point-box_bg_01.jpg); } }

@media (min-width: 960px) { .four-point-section.natural .cbox { background-color: rgba(0, 0, 0, 0.7); } }

.four-point-section.natural .section-header { background-image: url(../img/4point-box_sp_img_01.jpg); background-repeat: no-repeat; background-size: 100vw auto; background-position: 50% 100%; padding-bottom: 54vw; }

@media (min-width: 960px) { .four-point-section.natural .section-header { background: none; padding-bottom: 0; } }

.four-point-section.natural .section-title { color: #fff; }

.four-point-section.natural .item-box { background: url(../img/4point-box_01_sp_img.png) no-repeat 50% 100%; background-size: 90vmin auto; padding-bottom: 30vmin; }

@media (min-width: 601px) { .four-point-section.natural .item-box { background: none; padding-bottom: 0; } }

.four-point-section.natural .read-text, .four-point-section.natural .text { color: #fff; }

.four-point-section.natural .text { padding: 8px 0 0; }

@media (min-width: 601px) { .four-point-section.natural .text { background-repeat: no-repeat; background-position: 100% 100%; background-size: 16% auto; padding: 4px 21% 0 0; }
  .four-point-section.natural .text:nth-of-type(1) { background-image: url(../img/4point-box_01_img_01.jpg); }
  .four-point-section.natural .text:nth-of-type(2) { background-image: url(../img/4point-box_01_img_02.jpg); }
  .four-point-section.natural .text:nth-of-type(3) { background-image: url(../img/4point-box_01_img_03.png); } }

@media (min-width: 960px) { .four-point-section.natural .text { background-position: 100% 4px; background-size: 30% auto; padding-right: 31%; margin-bottom: 1.2em; } }

@media (min-width: 1200px) { .four-point-section.natural .text { margin-bottom: 1.5em; } }

.four-point-section.natural h4 { width: 6em; margin-bottom: 0.6em; background-image: url(../img/4point-box-title_bg_01.png); background-repeat: no-repeat; background-size: cover; padding: 4px; text-align: center; -webkit-transform: rotate(-4deg); -ms-transform: rotate(-4deg); transform: rotate(-4deg); }

.four-point-section.natural .to_menu a { color: #fff; }

.four-point-section.carbon { position: relative; background-image: url(../img/4point-box_sp_02_bg.jpg); }

@media (min-width: 960px) { .four-point-section.carbon { background-image: url(../img/4point-box_02_bg.jpg); } }

@media (min-width: 960px) { .four-point-section.carbon .cbox { background: rgba(255, 255, 255, 0.8); margin-left: 50%; } }

.four-point-section.carbon .section-header { background-image: url(../img/4point-box_sp_img_02.jpg); background-repeat: no-repeat; background-size: 100vw auto; background-position: 50% 100%; padding-bottom: 54vw; }

@media (min-width: 960px) { .four-point-section.carbon .section-header { background: none; padding-bottom: 0; margin-bottom: 52px; } }

.four-point-section.carbon h4 { margin-bottom: 0.4em; }

@media (min-width: 960px) { .four-point-section.carbon h4 { font-size: 1.25rem; margin-bottom: 0.5em; } }

@media (min-width: 960px) { .four-point-section.carbon .text { margin-bottom: 34px; line-height: 1.8; }
  .four-point-section.carbon .text:last-of-type { margin-bottom: 12px; } }

.four-point-section.carbon .photos { width: 86%; margin: 0 auto 0.6em; }

@media (min-width: 960px) { .four-point-section.carbon .photos { position: absolute; bottom: 52px; left: 2%; width: 46%; margin: 0 auto; } }

.four-point-section.carbon .photos img { width: 100%; height: auto; margin-bottom: 4px; }

.four-point-section.carbon .photos figcaption { font-size: 0.88rem; }

@media (min-width: 960px) { .four-point-section.carbon .photos figcaption { margin-top: 4px; font-size: 1rem; font-weight: 700; color: #fff; } }

.four-point-section.carbon .to_menu a { color: #212121; }

.four-point-section.wall { background-image: url(../img/4point-box_sp_03_bg.jpg); }

@media (min-width: 960px) { .four-point-section.wall { background-image: url(../img/4point-box_03_bg.jpg); } }

@media (min-width: 960px) { .four-point-section.wall .cbox { background: rgba(255, 255, 255, 0.8); } }

.four-point-section.wall .section-header { background-image: url(../img/4point-box_sp_img_03.jpg); background-repeat: no-repeat; background-size: 100vw auto; background-position: 50% 100%; padding-bottom: 53vw; }

@media (min-width: 960px) { .four-point-section.wall .section-header { background: none; padding-top: 28px; padding-bottom: 0; } }

@media (min-width: 1200px) { .four-point-section.wall .section-header { padding-top: 52px; } }

@media (min-width: 960px) { .four-point-section.wall .sub-title { padding-left: 0.6em; font-size: 1rem; } }

@media (min-width: 1200px) { .four-point-section.wall .sub-title { display: inline-block; } }

.four-point-section.wall h4, .four-point-section.wall .text { text-align: center; }

@media (min-width: 960px) { .four-point-section.wall h4, .four-point-section.wall .text { text-align: left; } }

.four-point-section.wall h4 { margin-bottom: 0.4em; }

@media (min-width: 960px) { .four-point-section.wall h4 { font-size: 1.25rem; } }

.four-point-section.wall .ingredient-text { text-align: center; }

.four-point-section.wall .to_menu a { color: #212121; }

.four-point-section.fcc { position: relative; background-image: url(../img/4point-box_sp_04_bg.jpg); }

@media (min-width: 960px) { .four-point-section.fcc { background-image: url(../img/4point-box_04_bg.jpg); } }

.four-point-section.fcc .section-title, .four-point-section.fcc h4, .four-point-section.fcc .text { color: #fff; }

.four-point-section.fcc h4 { margin-bottom: 0.4em; }

@media (min-width: 960px) { .four-point-section.fcc h4 { font-size: 1.25rem; } }

@media (min-width: 960px) { .four-point-section.fcc .cbox { background: rgba(46, 100, 26, 0.65); margin-left: 50%; } }

.four-point-section.fcc .section-header { padding-top: 28px; }

@media (min-width: 960px) { .four-point-section.fcc .sub-title { display: block; margin-top: 4px; font-size: 1.25rem; } }

.four-point-section.fcc .to_menu a { color: #fff; }

@media (min-width: 960px) { .four-point-section .fcc-illust { display: block; width: auto; position: absolute; bottom: 0; left: 14.16667%; } }

@media (min-width: 1200px) { .four-point-section .fcc-illust { left: 19.16667%; } }

.four-point-section .fcc-illust img { width: 100%; height: auto; }

.four-point-section .illust-text { padding-bottom: 0.8em; font-weight: 700; color: #fff; text-align: center; }

.four-point-section .illust-text br { display: none; }

@media (min-width: 960px) { .four-point-section .illust-text br { display: block; } }

@media (min-width: 960px) { .four-point-section .illust-text { width: auto; font-size: 1.38rem; text-align: left; color: #39a745; line-height: 1.25; } }

.four-point-section .illust-box { width: 75%; margin: 0 auto 24px; }

@media (min-width: 601px) { .four-point-section .illust-box { width: 40%; } }

@media (min-width: 960px) { .four-point-section .illust-box { width: auto; margin-bottom: 0; } }

.color-valiation { margin-top: 32px; }

@media (min-width: 601px) { .color-valiation { margin-top: 4px; } }

.color-valiation > .section-header { position: relative; z-index: 10; height: 20%; height: 25vmin; padding: 5% 2.86% 0; padding: 5vmin 2.86% 0; background-color: #212121; background-image: url(../img/color-valiation-title_bg.jpg); background-repeat: no-repeat; border-top: 0 0; background-size: cover; }

@media (min-width: 960px) { .color-valiation > .section-header { height: 164px; background-attachment: fixed; } }

@media (max-width: 600px) and (orientation: landscape) { .color-valiation > .section-header { height: 32vmin; } }

.color-valiation > .section-header .section-title { padding-top: 4vmin; background-image: url(../img/color-vali-title_bg_l.png), url(../img/color-vali-title_bg_r.png); background-position: 0 0,100% 0; background-repeat: no-repeat,no-repeat; background-size: 16% auto; font-size: 0.94rem; font-size: 3.125vw; color: #fff; line-height: 1.25; letter-spacing: 0.08em; text-align: center; }

@media (min-width: 960px) { .color-valiation > .section-header .section-title { width: 820px; margin: 0 auto; padding-top: 1em; font-size: 1.38rem; background-size: auto; } }

@media (min-width: 960px) { .color-valiation > .section-header .section-title br { display: none; } }

.clr-vali-navi { position: relative; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; margin: 4px 0; }

@media (min-width: 1200px) { .clr-vali-navi { width: 1200px; margin: 4px auto; } }

.clr-vali-navi .list { position: relative; -ms-flex-preferred-size: 33%; flex-basis: 33%; cursor: pointer; }

@media (min-width: 1200px) { .clr-vali-navi .list { -ms-flex-preferred-size: 33%; flex-basis: 33%; } }

.clr-vali-navi .list a { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; height: 33.333vw; background-repeat: no-repeat; background-position: 0 0; background-size: cover; padding: 52% 4% 0; font-size: 0.75rem; font-size: 3.125vw; color: #212121; line-height: 1.25; text-align: center; }

@media (min-width: 601px) { .clr-vali-navi .list a { height: 14.14vw; padding: 26% 4% 0; font-size: 1rem; font-size: 1.40625vw; } }

@media (min-width: 1200px) { .clr-vali-navi .list a { height: 168px; font-size: 0.88rem; } }

.clr-vali-navi .list::after { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); content: ''; -webkit-transition: background .6s; -o-transition: background .6s; transition: background .6s; }

.clr-vali-navi .list.current::after, .clr-vali-navi .list.current:hover::after { background: transparent; }

.clr-vali-navi .list:hover::after { background: rgba(0, 0, 0, 0.2); }

.clr-vali-navi .na-clr a { background-image: url(../img/natural_btn_sp_bg.jpg); }

@media (min-width: 601px) { .clr-vali-navi .na-clr a { background-image: url(../img/natural_btn_bg.jpg); } }

.clr-vali-navi .wh-clr a { background-image: url(../img/white_btn_sp_bg.jpg); }

@media (min-width: 601px) { .clr-vali-navi .wh-clr a { background-image: url(../img/white_btn_bg.jpg); } }

.clr-vali-navi .an-clr a { background-image: url(../img/antique_btn_sp_bg.jpg); }

@media (min-width: 601px) { .clr-vali-navi .an-clr a { background-image: url(../img/antique_btn_bg.jpg); } }

.color-vali-wrap { position: relative; z-index: 2; width: 100%; }

@media (min-width: 1200px) { .color-vali-wrap { width: 1200px; margin: 0 auto; } }

.color-vali-box { background-repeat: no-repeat; background-position: 0 0; background-size: cover; padding: 30px 5%; min-height: 100vh; }

@media (min-width: 360px) { .color-vali-box { min-height: 66vh; } }

@media (min-width: 960px) { .color-vali-box { display: -webkit-box; display: -ms-flexbox; display: flex; min-height: 0; height: 62.16667vw; padding: 66.5px 12.8px 0; padding: 66.5px 12.8px 0; padding: 6.5vw 1.25vw 0; background-size: contain; } }

@media (min-width: 1200px) { .color-vali-box { height: 746px; padding: 78px 15px 0; } }

@media (min-width: 960px) { .color-vali-box .left-box, .color-vali-box .right-box { width: 50%; } }

.color-vali-box .left-box .text, .color-vali-box .right-box .text { line-height: 1.5; }

.color-vali-box .left-box .text br, .color-vali-box .right-box .text br { display: none; }

@media (min-width: 601px) { .color-vali-box .left-box .text br, .color-vali-box .right-box .text br { display: block; } }

.color-vali-box .section-header { margin-bottom: 2em; }

@media (min-width: 960px) { .color-vali-box .section-header { margin-bottom: 1em; } }

@media (min-width: 1200px) { .color-vali-box .section-header { padding: 0 0 44px 12px; } }

.color-vali-box .section-header .text { width: 75%; margin-left: auto; margin-right: auto; line-height: 1.4; }

@media (min-width: 601px) { .color-vali-box .section-header .text { margin-left: 0; margin-right: 0; } }

@media (min-width: 960px) { .color-vali-box .section-header .text { width: 100%; margin-left: 0; margin-right: 0; text-align: left; font-size: 1rem; } }

@media (min-width: 1200px) { .color-vali-box .section-header .text { font-size: 1.25rem; } }

.color-vali-box .section-title { margin-bottom: 1em; text-align: center; }

@media (min-width: 601px) { .color-vali-box .section-title { text-align: left; } }

@media (min-width: 1200px) { .color-vali-box .section-title { margin-bottom: 34px; } }

.color-vali-box .section-title img { width: 85%; height: auto; }

@media (min-width: 601px) { .color-vali-box .section-title img { width: 40.364%; width: 40.364vmin; } }

@media (min-width: 960px) { .color-vali-box .section-title img { width: 50%; } }

.color-vali-box .sub-title { display: block; font-weight: 500; margin-bottom: 0.4em; }

@media (min-width: 960px) { .color-vali-box .sub-title { margin-bottom: 10px; } }

@media (min-width: 960px) { .color-vali-box .cbox .text { margin-bottom: 1em; font-size: 1.25rem; line-height: 1.6; text-align: center; } }

@media (min-width: 1200px) { .color-vali-box .cbox .text { margin-bottom: 1em; font-size: 1.25rem; line-height: 1.6; } }

.color-vali-box .photos { width: 100%; margin-bottom: 1em; }

@media (min-width: 960px) { .color-vali-box .photos { width: 97.5%; margin-bottom: 46px; margin-bottom: 46px; } }

@media (min-width: 1200px) { .color-vali-box .photos { margin-bottom: 63px; } }

.color-vali-box .photos img { width: 100%; height: auto; }

@media (min-width: 1200px) { .color-vali-box .photos img { width: auto; } }

.color-vali-box.natural-color { background-image: url(../img/color-val-box_sp_01.jpg); }

@media (min-width: 960px) { .color-vali-box.natural-color { background-image: url(../img/natural-color_bg._02.jpg); } }

.color-vali-box.natural-color .section-title { color: #212121; }

@media (min-width: 1200px) { .color-vali-box.natural-color .cbox .text { color: #212121; } }

@media (min-width: 960px) { .color-vali-box.natural-color .right-box { padding: 0 12px 0 50px; padding: 0 1vw 0 4.16667vw; } }

@media (min-width: 1200px) { .color-vali-box.natural-color .right-box { padding: 0 12px 0 50px; } }

@media (min-width: 960px) { .color-vali-box.natural-color .right-box .text { padding: 32px 40px; padding: 2.66667vw 3.33333vw; background: rgba(255, 255, 255, 0.75); border-radius: 20px; color: #212121; line-height: 1.8; } }

@media (min-width: 1200px) { .color-vali-box.natural-color .right-box .text { padding: 32px 40px; font-size: 1.13rem; } }

.color-vali-box.white-color { background-image: url(../img/color-val-box_sp_02.jpg); }

@media (min-width: 960px) { .color-vali-box.white-color { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } }

@media (min-width: 960px) { .color-vali-box.white-color { background-image: url(../img/white-color_bg_01.jpg); } }

@media (min-width: 960px) { .color-vali-box.white-color .section-header { padding-left: 35.84px; padding-left: 3.5vw; } }

@media (min-width: 1200px) { .color-vali-box.white-color .section-header { padding-left: 42px; } }

@media (min-width: 960px) { .color-vali-box.white-color .photos { margin-left: 12.8px; margin-left: 1.25vw; } }

@media (min-width: 1200px) { .color-vali-box.white-color .photos { margin: 0 15px 63px; } }

@media (min-width: 1200px) { .color-vali-box.white-color .cbox .text { color: #212121; } }

@media (min-width: 960px) { .color-vali-box.white-color .left-box { padding: 0 40.96px 0 10.24px; padding: 0 4vw 0 1vw; } }

@media (min-width: 1200px) { .color-vali-box.white-color .left-box { padding: 0 48px 0 12px; } }

@media (min-width: 960px) { .color-vali-box.white-color .left-box .text { padding: 32px 40px; padding: 2.66667vw 3.33333vw; background: rgba(255, 255, 255, 0.75); border-radius: 20px; color: #212121; line-height: 1.8; } }

@media (min-width: 1200px) { .color-vali-box.white-color .left-box .text { padding: 32px 40px; font-size: 1.13rem; } }

.color-vali-box.antique-color { background-image: url(../img/color-val-box_sp_03.jpg); }

@media (min-width: 960px) { .color-vali-box.antique-color { background-image: url(../img/antique-color_bg_01.jpg); } }

.color-vali-box.antique-color .text { color: #fff; }

.color-vali-box.antique-color .section-title { color: #fff; }

@media (min-width: 960px) { .color-vali-box.antique-color .right-box { padding: 0 12px 0 50px; padding: 0 1vw 0 4.16667vw; } }

@media (min-width: 1200px) { .color-vali-box.antique-color .right-box { padding: 0 12px 0 50px; } }

@media (min-width: 960px) { .color-vali-box.antique-color .right-box .text { padding: 32px 40px; padding: 2.66667vw 3.33333vw; background: rgba(255, 255, 255, 0.75); border-radius: 20px; color: #212121; line-height: 1.8; } }

@media (min-width: 1200px) { .color-vali-box.antique-color .right-box .text { padding: 32px 40px; font-size: 1.13rem; } }

#freeplan { color: #355241; background-color: #f9fbf4; padding: 28px 0; }

#freeplan .cnts_wrapper { background: url(../img/elg_frm_btm.png) no-repeat 50% 100%, url(../img/elg_frm_top.png) no-repeat 50% 0; }

@media (max-width: 600px) { #freeplan .cnts_wrapper { width: 100%; padding: 73px 0; background-size: 80%; } }

@media (min-width: 360px) { #freeplan .cnts_wrapper { background-size: 60%; } }

@media (min-width: 601px) { #freeplan .cnts_wrapper { padding: 73px 0 140px; background-size: auto; } }

#freeplan h2 { line-height: 1.8; }

@media (max-width: 600px) { #freeplan h2 { width: 90%; margin: 0 auto 40px; }
  #freeplan h2 br { display: none; } }

@media (min-width: 360px) { #freeplan h2 { width: 58%; text-align: center; } }

@media (min-width: 601px) { #freeplan h2 { width: 60%; margin: 0 auto 60px; font-size: 1.25em; font-size: 2.08333vw; text-align: center; } }

@media (min-width: 1200px) { #freeplan h2 { font-size: 1.25rem; } }

#freeplan h3 { background-image: url(../img/free_plan_title_bg.png); background-repeat: no-repeat; background-position: 0 0; line-height: 1.5; text-align: center; }

@media (max-width: 600px) { #freeplan h3 { margin: 0 0 2em 3%; background-position: 50% 0; } }

@media (min-width: 601px) { #freeplan h3 { margin: 0 auto 50px; background-size: contain; font-size: 1rem; font-size: 1.875vw; } }

@media (min-width: 960px) { #freeplan h3 { width: 72.39%; font-size: 1.13em; } }

#freeplan h3 span { display: block; }

#freeplan p { font-size: 1em; font-weight: 400; line-height: 1.8; }

@media (max-width: 600px) { #freeplan p { padding: 0 3% 2.8em; } }

@media (min-width: 601px) { #freeplan p { min-height: 280px; padding: 18px 22px; font-size: 1.66667vw; letter-spacing: 0.05em; } }

@media (min-width: 960px) { #freeplan p { font-size: 1rem; } }

@media (min-width: 1200px) { #freeplan p { min-height: 230px; } }

#freeplan .cbox-wrap { width: 100%; padding: 0 2%; }

@media (min-width: 601px) { #freeplan .cbox-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; } }

@media (min-width: 1200px) { #freeplan .cbox-wrap { width: 1200px; margin: 0 auto; } }

@media (min-width: 601px) { #freeplan .cbox { width: 33.33%; }
  #freeplan .cbox:nth-of-type(-n+2) p { background: url(../img/dot_line_vrt.png) no-repeat 100% 0; } }

#specification { width: 100%; color: #432107; background: #fff; }

@media (max-width: 600px) { #specification { padding-top: 38px; padding-top: 10.1vw; padding-bottom: 22px; padding-bottom: 3.8vh; } }

@media (min-width: 601px) { #specification { padding-top: 38px; padding-top: 3.166vw; } }

@media (min-width: 1200px) { #specification { width: 1200px; margin: 0 auto; padding-top: 38px; } }

#specification h2 { margin: 0 auto; background-image: url(../img/dsn_spec_title_bg.png); background-repeat: no-repeat; background-position: 50% 0; text-align: center; }

@media (max-width: 600px) { #specification h2 { width: 100%; height: 23.6vw; font-size: 1.13rem; font-size: 5vw; padding: 20px 20px 0; background-size: 90%; } }

@media (min-width: 360px) { #specification h2 { width: 70%; font-size: 1.13rem; font-size: 3.75vw; background-size: 100%; } }

@media (min-width: 601px) { #specification h2 { width: 36.33%; width: 36.33vw; min-height: 114px; padding: 30px 36px 0; background-size: contain; font-size: 1.25em; } }

@media (min-width: 1200px) { #specification h2 { width: 442px; background-size: auto; font-size: 1.5em; } }

#specification h2 .sub_title { display: block; font-weight: 400; }

@media (max-width: 600px) { #specification h2 .sub_title { margin-top: 6px; margin-top: 1.6vw; } }

@media (min-width: 601px) { #specification h2 .sub_title { margin-top: 12px; font-size: 1.13rem; } }

#specification .cbox-wrap { width: 100%; padding: 0 0 30px; }

@media (min-width: 601px) { #specification .cbox-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } }

@media (max-width: 600px) { #specification dl { width: 95%; margin: 22px auto 0; margin: 4.8vw auto 0; } }

@media (min-width: 360px) { #specification dl { width: 90%; margin: 22px auto 0; margin: 3.8vw auto 0; } }

@media (min-width: 601px) { #specification dl { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; max-width: 33.333%; padding: 0 24px; padding: 0 2vw; } }

@media (min-width: 1200px) { #specification dl { padding: 0 24px; } }

#specification dl dt { font-size: 1.13em; font-weight: 700; padding-bottom: 4px; }

#specification dl dt::before { display: inline-block; margin-right: 4px; font-size: 1.94rem; color: #9b7656; content: '■'; }

#specification dl .img_box img { width: 100%; height: auto; }

#specification dl h4 { font-size: 0.88em; line-height: 1.5; padding-bottom: 0.6rem; }

#specification dl p { font-size: 0.88em; line-height: 1.5; }

#selectable { padding-bottom: 25px; padding-bottom: 6.66vw; background-color: #fcf4eb; background-image: url(../img/dot_line_hrz.png), url(../img/dot_line_hrz.png); background-repeat: repeat-x; background-position: 0 0,0 100%; }

@media (min-width: 601px) { #selectable { padding: 25px 35px 28px; padding: 2.08vw 2.91vw 2.33vw; } }

@media (min-width: 1200px) { #selectable { padding: 25px 35px 28px; } }

#selectable h2 { background-image: url(../img/selectable_title.bg.png); background-repeat: no-repeat; background-position: 0 0; font-size: 1.13em; color: #fff; }

@media (max-width: 600px) { #selectable h2 { width: 100%; padding: 10px 0; background: #6da584; text-align: center; } }

@media (min-width: 601px) { #selectable h2 { min-height: 34px; margin-bottom: 30px; margin-bottom: 2.5vw; padding: 8px 0 0 58px; padding: 0.66vw 0 0 4.83vw; } }

@media (min-width: 1200px) { #selectable h2 { min-height: 34px; margin-bottom: 30px; padding: 8px 0 0 58px; } }

#selectable dl { color: #432107; text-align: center; background-image: url(../img/std_hi_spec_bg.png); background-position: 50% 100%; background-repeat: no-repeat; width: 46%; margin: 22px auto; margin: 5.8vw auto; padding: 0 2%; padding-bottom: 10px; background-size: contain; }

@media (min-width: 601px) { #selectable dl { width: 95%; margin: 0 auto; min-height: 54px; min-height: 4.5vw; padding-bottom: 4px; background-size: contain; } }

@media (min-width: 960px) { #selectable dl { width: 80.25%; } }

@media (min-width: 1200px) { #selectable dl { width: 317px; min-height: 54px; } }

@media (min-width: 601px) { #selectable dl:nth-of-type(1) { margin: 6px auto 28px; } }

@media (min-width: 1200px) { #selectable dl:nth-of-type(1) { margin-bottom: 58px; } }

#selectable dt { font-size: 1.13rem; font-size: 4vw; font-weight: 700; line-height: 1.75; }

@media (min-width: 601px) { #selectable dt { font-size: 1em; font-size: 1.875vw; } }

@media (min-width: 1200px) { #selectable dt { font-size: 1.13em; } }

#selectable dd { font-size: 0.88rem; font-size: 3.5vw; }

@media (min-width: 601px) { #selectable dd { font-size: 0.75em; font-size: 1.45833vw; } }

@media (min-width: 960px) { #selectable dd { font-size: 0.88em; } }

@media (min-width: 1200px) { #selectable dd { font-size: 1em; } }

#selectable nav { clear: both; background-image: url(../img/spec_ling_bg.png), url(../img/spec_ling_bg.png); background-repeat: no-repeat; background-position: 0 0,0 100%; }

@media (max-width: 600px) { #selectable nav { width: 80%; margin: 60px auto 0; margin: 16vw auto 0; padding: 14px 5%; text-align: center; line-height: 1.4; background-position: 50% 0,50% 100%; } }

@media (min-width: 360px) { #selectable nav { margin: 20px auto 0; margin: 2.71vw auto 0; } }

@media (min-width: 601px) { #selectable nav { margin-top: 35px; padding: 12px 0 12px 4px; margin-left: 33%; } }

@media (min-width: 1200px) { #selectable nav { margin-top: 35px; padding: 12px 0 12px 4px; } }

#selectable nav a { display: block; color: #432107; text-decoration: none; }

@media (min-width: 601px) { #selectable nav a { background-image: url(../img/spec_arrow.png); background-repeat: no-repeat; background-position: 95% 50%; width: 438px; } }

@media (max-width: 600px) { #selectable .c_wrapper { width: 100%; padding: 25px 2.5% 0; padding: 6.66vw 2.5% 0; } }

@media (min-width: 1200px) { #selectable .c_wrapper { width: 1200px; margin: 0 auto; } }

#selectable .row { width: 100%; }

@media (min-width: 601px) { #selectable .row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row nowrap; flex-flow: row nowrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } }

@media (min-width: 601px) { #selectable .cbox { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; } }

#selectable .cbox:nth-of-type(1) { display: -webkit-box; display: -ms-flexbox; display: flex; }

@media (min-width: 601px) { #selectable .cbox:nth-of-type(1) { display: block; } }

#selectable .cbox:nth-of-type(n+2) { display: inline-block; width: 48%; }

@media (min-width: 601px) { #selectable .cbox:nth-of-type(n+2) { width: 33.333%; } }

#selectable .cbox p { color: #942719; line-height: 1.4; text-align: center; background-image: url(../img/std_hi_frm_top.png), url(../img/std_hi_frm_btm.png); background-repeat: no-repeat,no-repeat; background-position: 50% 0,50% 100%; width: 95%; margin: 22px auto; margin: 5.8vw auto; padding: 35px 0; background-size: contain; font-size: 0.88rem; font-size: 3.33333vw; }

@media (min-width: 601px) { #selectable .cbox p { width: 76.7%; width: 25.25vw; min-height: 188px; min-height: 15.66vw; margin: 0 auto; padding: 35px 0 0; padding: 5.4vw 0 0; background-size: contain; font-size: 0.69rem; font-size: 1.66667vw; } }

@media (min-width: 960px) { #selectable .cbox p { font-size: 1rem; font-size: 1.66667vw; } }

@media (min-width: 1200px) { #selectable .cbox p { min-height: 188px; background-size: auto; padding: 70px 0 0; font-size: 1.13em; } }

#options { background: url(../img/options_bg.jpg); }

#options .cbox { width: 100%; padding: 38px 0 38px; padding: 10.1vw 0 22.66vw; }

@media (min-width: 601px) { #options .cbox { width: 100%; padding: 38px 0 0; padding: 10.1vw 0 5vw; } }

@media (min-width: 1200px) { #options .cbox { width: 1200px; margin: 0 auto; padding: 38px 0; } }

#options h2 { background-image: url(../img/options_title_bg.png); background-repeat: no-repeat; background-position: 0 0; font-size: 1.13em; color: #432107; }

@media (max-width: 600px) { #options h2 { width: 100%; padding: 10px 0; background: #dfd07d; text-align: center; } }

@media (min-width: 601px) { #options h2 { min-height: 34px; padding: 8px 0 0 58px; padding: 0.66vw 0 0 4.83vw; } }

@media (min-width: 1200px) { #options h2 { min-height: 34px; padding: 8px 0 0 58px; } }

#options .item-wrap { width: 100%; }

@media (min-width: 601px) { #options .item-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-flow: row wrap; flex-flow: row wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } }

#options .optbox { width: 90%; margin: 22px auto 0; margin: 2.66vw auto 0; }

@media (min-width: 601px) { #options .optbox { -ms-flex-preferred-size: 33.333%; flex-basis: 33.333%; max-width: 33.333%; width: auto; padding: 0 24px; padding: 0 2vw; } }

@media (min-width: 1200px) { #options .optbox { height: 298px; padding: 0 24px; } }

#options .optbox h3 { font-size: 1em; font-weight: 700; padding-bottom: 4px; }

@media (min-width: 601px) { #options .optbox h3 { font-size: 1.13em; } }

#options .optbox h3::before { display: inline-block; margin-right: 4px; font-size: 1.94rem; color: #9b7656; content: '■'; }

@media (min-width: 1200px) { #options .optbox .img_box { width: 100%; overflow: hidden; } }

#options .optbox .img_box img { width: 100%; height: auto; /* 画像縮小時のボケ防止*/ image-rendering: -moz-crisp-edges; /* Firefox */ image-rendering: -o-crisp-edges; /* Opera */ image-rendering: -webkit-optimize-contrast; /* Webkit (非標準の名前) */ image-rendering: crisp-edges; }

#infograph { width: 100%; background: #fff; padding: 40px 0; padding: 3.8vw 0; }

@media (min-width: 601px) { #infograph { padding: 30px 0; padding: 2.5vw 0; } }

@media (min-width: 1200px) { #infograph { width: 1200px; margin: 0 auto; paddin: 30px 0; } }

#infograph p { margin: 0 auto; }

@media (min-width: 601px) { #infograph p { width: 98%; width: 79.16vw; } }

@media (min-width: 1200px) { #infograph p { width: 1000px; } }

#infograph p img { width: 100%; height: auto; }

#constructions { background: url(../img/options_bg.jpg); color: #432107; }

#constructions .cbox { width: 100%; padding: 36px 0 63px 0; padding: 3vw 0 5.25vw 0; }

@media (min-width: 601px) { #constructions .cbox { padding: 36px 0 63px 0; padding: 3vw 0 5.25vw 0; } }

@media (min-width: 1200px) { #constructions .cbox { width: 1200px; margin: 0 auto; padding: 36px 0 63px 0; } }

#constructions .cbox:after { display: block; clear: both; overflow: hidden; height: 0; content: ''; }

#constructions h2 { font-size: 1.13em; text-align: center; }

@media (max-width: 600px) { #constructions ul { padding: 0 5%; margin-top: 38px; margin-top: 3.166vw; } }

@media (min-width: 601px) { #constructions ul { margin-top: 38px; margin-top: 3.166vw; } }

@media (min-width: 1200px) { #constructions ul { margin-top: 38px; } }

#constructions li { float: left; overflow: hidden; position: relative; border: 8px solid #fff; -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.25); box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.25); }

@media (max-width: 600px) { #constructions li { width: 46%; height: 40vw; margin: 30px 2% 14px 2%; } }

@media (min-width: 360px) { #constructions li { width: 28%; width: 28vw; height: 28vw; margin: 30px 1% 14px 1%; } }

@media (min-width: 601px) { #constructions li { width: 122px; height: 122px; width: 15.25vw; height: 15.25vw; margin: 0 3px; margin: 0 0.375vw; } }

@media (min-width: 960px) { #constructions li { width: 184px; height: 184px; width: 15.33vw; height: 15.33vw; margin: 0 5px; } }

@media (min-width: 1200px) { #constructions li { height: 184px; width: 184px; margin: 0 8px; } }

#constructions li h3, #constructions li p { position: absolute; z-index: 10; }

#constructions li h3 { top: 4px; padding: 0 6px; line-height: 1.4; -webkit-transform: translateY(-110%); -ms-transform: translateY(-110%); transform: translateY(-110%); -webkit-transition: -webkit-transform .2s; transition: -webkit-transform .2s; -o-transition: transform .2s; transition: transform .2s; transition: transform .2s, -webkit-transform .2s; }

@media (max-width: 600px) { #constructions li h3 { /*smartphone*/ font-size: 0.75rem; } }

@media (min-width: 601px) { #constructions li h3 { /*tablet*/ font-size: 0.63rem; } }

@media (min-width: 960px) { #constructions li h3 { /*laptopc*/ font-size: 0.81rem; } }

@media (min-width: 1200px) { #constructions li h3 { /*desctop*/ font-size: 0.88rem; } }

#constructions li p { bottom: 6px; width: 100%; padding: 0 6px; font-size: 0.69em; text-align: right; -webkit-transform: translateY(180%); -ms-transform: translateY(180%); transform: translateY(180%); -webkit-transition: -webkit-transform .4s .4s; transition: -webkit-transform .4s .4s; -o-transition: transform .4s .4s; transition: transform .4s .4s; transition: transform .4s .4s, -webkit-transform .4s .4s; }

#constructions li::after, #constructions li::before { display: block; position: absolute; z-index: 2; width: 200%; height: 100%; background: rgba(0, 0, 0, 0.6); content: ''; }

#constructions li::after { -webkit-transform: translateY(-90%) rotate(-6deg); -ms-transform: translateY(-90%) rotate(-6deg); transform: translateY(-90%) rotate(-6deg); -webkit-transform-origin: 0 100%; -ms-transform-origin: 0 100%; transform-origin: 0 100%; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; }

#constructions li::before { -webkit-transform: translateY(90%) rotate(-6deg); -ms-transform: translateY(90%) rotate(-6deg); transform: translateY(90%) rotate(-6deg); -webkit-transition: -webkit-transform,.4s .4s; -webkit-transition: -webkit-transform .4s .4s; transition: -webkit-transform .4s .4s; -o-transition: transform .4s .4s; transition: transform .4s .4s; transition: transform .4s .4s, -webkit-transform .4s .4s; }

#constructions li img { display: block; position: absolute; z-index: 1; -webkit-box-sizing: border-box; box-sizing: border-box; left: 50%; width: auto; height: 100%; backface-visibility: hidden; -webkit-backface-visibility: hidden; -webkit-transform-origin: 290% 50%; -ms-transform-origin: 290% 50%; transform-origin: 290% 50%; -webkit-transform: translateX(-50%) scale(1); -ms-transform: translateX(-50%) scale(1); transform: translateX(-50%) scale(1); -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; /* 画像縮小時のボケ防止*/ image-rendering: -moz-crisp-edges; /* Firefox */ image-rendering: -o-crisp-edges; /* Opera */ image-rendering: -webkit-optimize-contrast; /* Webkit (非標準の名前) */ image-rendering: crisp-edges; }

#constructions li a { display: block; text-decoration: none; color: #fff; }

#constructions li:hover h3, #constructions li.hover h3 { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

@media (max-width: 960px) { #constructions li:hover h3, #constructions li.hover h3 { -webkit-transform: translateY(10%); -ms-transform: translateY(10%); transform: translateY(10%); }
  #constructions li:hover h3::after, #constructions li.hover h3::after { content: ' 詳細へ'; font-size: 0.5rem; } }

#constructions li:hover p, #constructions li.hover p { -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); }

#constructions li:hover::after, #constructions li.hover::after { -webkit-transform: translateY(-48%) rotate(-6deg); -ms-transform: translateY(-48%) rotate(-6deg); transform: translateY(-48%) rotate(-6deg); }

@media (max-width: 960px) { #constructions li:hover::after, #constructions li.hover::after { -webkit-transform: translateY(-28%) rotate(-6deg); -ms-transform: translateY(-28%) rotate(-6deg); transform: translateY(-28%) rotate(-6deg); } }

#constructions li:hover::before, #constructions li.hover::before { -webkit-transform: translateY(68%) rotate(-6deg); -ms-transform: translateY(68%) rotate(-6deg); transform: translateY(68%) rotate(-6deg); }

#constructions li:hover img, #constructions li.hover img { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); }

.styledesign_bnr { background: #fff; width: 100%; margin: 0 auto; -webkit-box-sizing: content-box; box-sizing: content-box; padding: 30px 0; margin-top: 30px; }

@media (min-width: 960px) { .styledesign_bnr { width: 90%; padding: 10px 5% 60px; } }

@media (min-width: 1200px) { .styledesign_bnr { width: 960px; margin-top: 38px; padding: 10px 0 60px; } }

.styledesign_bnr .cbox { border: 1px solid #666; }

.styledesign_bnr .cbox::after { display: block; clear: both; height: 0; content: ''; }

.styledesign_bnr a { display: block; }

@media screen and (max-width: 480px) { .styledesign_bnr a { width: 100%; } }

@media screen and (min-width: 481px) and (max-width: 767px) { .styledesign_bnr a { float: left; width: 50%; } }

@media (min-width: 601px) { .styledesign_bnr a { float: left; width: 50%; } }

.styledesign_bnr img { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; height: auto; vertical-align: bottom; }

#prefooter { clear: both; position: relative; bottom: 0; overflow: hidden; z-index: 1000; -webkit-box-sizing: border-box; box-sizing: border-box; width: 100%; margin: 30px auto 0; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; }

@media (max-width: 600px) { #prefooter { display: none; } }

#prefooter .cbox { margin: 0 auto; background: #fffde6; overflow: hidden; -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); }

@media (min-width: 601px) { #prefooter .cbox { width: 77.5%; width: 79.16667vw; height: 66px; height: 5.5vw; } }

@media (min-width: 960px) { #prefooter .cbox { width: 77.5%; width: 77.5vw; height: 66px; height: 5.5vw; } }

@media (min-width: 1200px) { #prefooter .cbox { width: 922px; height: 66px; } }

#prefooter ul { overflow: hidden; padding: 5px 0px 4px 8px; }

#prefooter p { float: right; }

@media (min-width: 601px) { #prefooter p { width: 20.58333%; width: 20.58333vw; } }

@media (min-width: 1200px) { #prefooter p { width: 247px; } }

#prefooter p img { width: 100%; height: auto; }

#prefooter li { float: left; }

@media (min-width: 601px) { #prefooter li { width: 162; width: 13.5vw; height: 4.41667vw; } }

@media (min-width: 1200px) { #prefooter li { width: 162px; height: 53px; } }

#prefooter li:nth-of-type(-n+3) { margin-right: 6px; }

#prefooter li a { display: block; width: 100%; height: 100%; position: relative; }

#prefooter li img { position: absolute; display: block; top: 0; z-index: 1; left: 0; width: 100%; height: auto; -webkit-backface-visibility: hidden; backface-visibility: hidden; }

#prefooter li img:nth-of-type(1) { z-index: 2; -webkit-transition: z-index 0s .1s; -o-transition: z-index 0s .1s; transition: z-index 0s .1s; }

#prefooter li img:nth-of-type(2) { z-index: 1; -webkit-transition: z-index 0s .1s; -o-transition: z-index 0s .1s; transition: z-index 0s .1s; }

#prefooter li:hovre img:nth-of-type(1) { z-index: 1; -webkit-transition: z-index 0s .2s; -o-transition: z-index 0s .2s; transition: z-index 0s .2s; }

#prefooter li:hover img:nth-of-type(2) { z-index: 2; -webkit-transition: z-index 0s .2s; -o-transition: z-index 0s .2s; transition: z-index 0s .2s; }

#prefooter li a { -webkit-transform: perspective(600px) rotateY(0deg); transform: perspective(600px) rotateY(0deg); -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; -o-transition: transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; }

#prefooter li:hover a { -webkit-transform: perspective(600px) rotateY(180deg); transform: perspective(600px) rotateY(180deg); -webkit-transition: -webkit-transform .5s .1s; transition: -webkit-transform .5s .1s; -o-transition: transform .5s .1s; transition: transform .5s .1s; transition: transform .5s .1s, -webkit-transform .5s .1s; }

#prefooter.fixed { position: fixed; bottom: 0; left: 0; margin-bottom: 0; z-index: 1000; -webkit-transition: -webkit-transform .4s; transition: -webkit-transform .4s; -o-transition: transform .4s; transition: transform .4s; transition: transform .4s, -webkit-transform .4s; }

.tab_nav { position: relative; position: fixed; z-index: 1010; top: 230px; right: 0; }

@media (max-width: 600px) { .tab_nav { top: 65vh; } }

.tab_nav .doc_req { -webkit-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px); transition: opacity .6s,-webkit-transform .4s,transform .4s; }

@media screen and (max-width: 768px) { .tab_nav .doc_req { display: none; } }

@media (max-width: 959px) { .tab_nav .doc_req.tab_hide { opacity: .0; }
  .tab_nav .doc_req.tab_hide:hover { opacity: 1; } }

.tab_nav .doc_req:hover { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }

.tab_nav .to_top a { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; width: 56px; height: 58px; margin-top: 6px; padding-top: 12px; background: rgba(0, 0, 0, 0.8); border-radius: 8px 0 0 8px; font-size: 0.75em; text-align: center; -webkit-transform: translateX(5px); -ms-transform: translateX(5px); transform: translateX(5px); transition: -webkit-transform .2s, transform .2s; color: #fff; text-decoration: none; }

.tab_nav .to_top a:hover { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }

.tab_nav .to_top a::before { display: block; width: 0; height: 0; margin: 0 auto 8px; border-style: solid; border-width: 0 7px 12px 7px; border-color: transparent transparent #ffffff transparent; content: ''; }

@media (min-width: 601px) { .mb-btm-nv { display: none; } }

.mb-btm-nv { width: 100%; position: fixed; z-index: 10000; bottom: 0; }

.mb-btm-nv li { float: left; width: 25%; font-weight: 700; -webkit-box-sizing: border-box; box-sizing: border-box; }

.mb-btm-nv a { text-decoration: none; display: block; background-color: rgba(250, 218, 0, 0.9); text-align: center; color: #b58d12; height: 68px; height: 16.425vw; padding-top: 48px; padding-top: 11.59vw; -webkit-box-sizing: border-box; box-sizing: border-box; background-repeat: no-repeat; background-position: 50% 8px; background-position: 50% 1.923vw; background-size: 35%; font-size: 0.75em; }

@media only screen and (orientation: landscape) { .mb-btm-nv a { height: 50px; padding-top: 35px; font-size: 0.7rem; background-position: 50% 5px; background-size: 18%; } }

.mb-btm-nv li:nth-of-type(1) a { background-image: url(http://www.kogumahome.com/images/mobile/cal_icon.png); }

.mb-btm-nv li:nth-of-type(2) a { background-image: url(http://www.kogumahome.com/images/mobile/catalog_icon.png); }

.mb-btm-nv li:nth-of-type(3) a { background-image: url(http://www.kogumahome.com/images/mobile/contact_icon.png); }

.mb-btm-nv li:nth-of-type(4) a { background-image: url(http://www.kogumahome.com/images/mobile/tel_icon.png); }

.mb-btm-nv li:nth-of-type(-n+3) { border-right: 1px solid #fff; }

.lower .contents section ol { list-style-position: inside; }

@media (max-width: 600px) { .lower .contents section ol, .lower .contents section ul { margin: 0 2.66667% 0 4.66667%; margin: 0 2.66667vw 0 4.66667vw; font-size: 0.88rem; font-size: 5vw; line-height: 1.6; letter-spacing: 0.05em; } }

@media (min-width: 601px) { .lower .contents section ol, .lower .contents section ul { margin: 0 72px 0 56px; margin: 0 6vw 0 4.66667vw; font-size: 0.94rem; line-height: 1.9; } }

@media (min-width: 1200px) { .lower .contents section ol, .lower .contents section ul { margin: 0 72px 0 56px; font-size: 1rem; } }

.lower .contents section table { width: 90% !important; margin: 1em 0 1em 56px; border: 1px solid #ccc; border-collapse: separate; border-spacing: 0; }

.lower .contents section table th, .lower .contents section table td { padding: 1em 0.6em; }

.lower .contents section table th { background: #eeeeee; border: 1px solid #fff; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; border-collapse: separate; vertical-align: middle; }

@media (max-width: 600px) { .lower .contents section table th p { padding-bottom: 0.8em; font-size: 0.88rem; } }

@media (min-width: 601px) { .lower .contents section table th p { margin: 0; padding-bottom: 0.8em; } }

.lower .contents section table td { border-left: 1px solid #ccc; border-bottom: 1px solid #ccc; line-height: 1.8; }

@media (max-width: 600px) { .lower .contents section table td { font-size: 3.33333vw; } }

@media (max-width: 600px) { .lower .contents section table td p { margin: 0; padding: 0 0 0.8em 0; font-size: 0.88rem; font-size: 3.33333vw; } }

@media (min-width: 601px) { .lower .contents section table td p { margin: 0; padding-bottom: 0.8em; } }

.lower .contents section table.aligncenter { margin-left: auto; margin-right: auto; }

@media (max-width: 600px) { .lower .contents section img { display: block; width: 95%; margin: 1em auto; } }

.lower .contents section img.aligncenter { display: block; margin: 1em auto; }

@media (min-width: 601px) { .lower .contents section img.alignright { float: right; margin-bottom: 1em; margin-left: 1em; } }

@media (min-width: 601px) { .lower .contents section img.alignleft { float: left; margin-bottom: 1em; margin-right: 1em; } }

.lower .contents section .clear { clear: both; margin-top: 1em; margin-bottom: 1em; }

/* Slider */
.slick-slider { position: relative; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }

.slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0; }

.slick-list:focus { outline: none; }

.slick-list.dragging { cursor: pointer; cursor: hand; }

.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }

.slick-track { position: relative; left: 0; top: 0; display: block; }

.slick-track:before, .slick-track:after { content: ""; display: table; }

.slick-track:after { clear: both; }

.slick-loading .slick-track { visibility: hidden; }

.slick-slide { float: left; height: 100%; min-height: 1px; display: none; }

[dir="rtl"] .slick-slide { float: right; }

.slick-slide img { display: block; }

.slick-slide.slick-loading img { display: none; }

.slick-slide.dragging img { pointer-events: none; }

.slick-initialized .slick-slide { display: block; }

.slick-loading .slick-slide { visibility: hidden; }

.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }

.slick-arrow.slick-hidden { display: none; }

/* Slider */
.slick-loading .slick-list { background: #fff url("./ajax-loader.gif") center center no-repeat; }

/* Icons */
@font-face { font-family: "slick"; src: url("./fonts/slick.eot"); src: url("./fonts/slick.eot?#iefix") format("embedded-opentype"), url("./fonts/slick.woff") format("woff"), url("./fonts/slick.ttf") format("truetype"), url("./fonts/slick.svg#slick") format("svg"); font-weight: normal; font-style: normal; }

/* Arrows */
.slick-prev, .slick-next { position: absolute; display: block; height: 28px; width: 28px; z-index: 50; line-height: 0px; font-size: 0px; cursor: pointer; background: transparent; color: transparent; top: 24%; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); padding: 0; border: none; outline: none; opacity: 0.85; -webkit-transition: opacity .4s; -o-transition: opacity .4s; transition: opacity .4s; }

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { opacity: 1; }

.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity: 1; }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: 0.25; }

.slick-prev:before, .slick-next:before { font-family: "slick"; font-size: 0px; line-height: 1; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

@media (min-width: 601px) { .slick-prev, .slick-next { top: 50%; height: 38px; width: 38px; } }

@media (min-width: 960px) { .slick-prev, .slick-next { height: 48px; width: 48px; } }

.slick-prev { left: 0.5%; background-image: url(../img/arrow_l.png); background-repeat: no-repeat; background-position: 0 0; background-size: contain; }

[dir="rtl"] .slick-prev { left: auto; right: -25px; }

.slick-prev:before { content: "←"; }

[dir="rtl"] .slick-prev:before { content: "→"; }

.slick-next { right: 0.5%; background-image: url(../img/arrow_r.png); background-repeat: no-repeat; background-position: 0 0; background-size: cover; }

[dir="rtl"] .slick-next { left: -25px; right: auto; }

.slick-next:before { content: "→"; }

[dir="rtl"] .slick-next:before { content: "←"; }

/* Dots */
.slick-dotted.slick-slider { margin-bottom: 30px; }

.slick-dots { position: absolute; bottom: -25px; list-style: none; display: block; text-align: center; padding: 0; margin: 0; width: 100%; }

.slick-dots li { position: relative; display: inline-block; height: 40px; width: 40px; margin: 0 5px; padding: 0; cursor: pointer; }

.slick-dots li button { border: 0; background: transparent; display: block; height: 20px; width: 20px; outline: none; line-height: 0px; font-size: 0px; color: transparent; padding: 5px; cursor: pointer; }

.slick-dots li button:hover, .slick-dots li button:focus { outline: none; }

.slick-dots li button:hover:before, .slick-dots li button:focus:before { opacity: 1; }

.slick-dots li button:before { position: absolute; top: 0; left: 0; content: "•"; width: 20px; height: 20px; font-family: "slick"; font-size: 6px; line-height: 20px; text-align: center; color: black; opacity: 0.25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-dots li.slick-active button:before { color: black; opacity: 0.85; }

.appear { -webkit-transition-property: opacity,-webkit-transform; transition-property: opacity,-webkit-transform; -o-transition-property: opacity,transform; transition-property: opacity,transform; transition-property: opacity,transform,-webkit-transform; -webkit-transition-timing-function: ease,ease; -o-transition-timing-function: ease,ease; transition-timing-function: ease,ease; }

.introduction .section-title.appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: .8s,1.2s; -o-transition-duration: .8s,1.2s; transition-duration: .8s,1.2s; }

.introduction .section-title.dissapear { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); opacity: 0; }

.introduction .text-box .appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: 1s,1s; -o-transition-duration: 1s,1s; transition-duration: 1s,1s; -webkit-transition-delay: .8s,.4s; -o-transition-delay: .8s,.4s; transition-delay: .8s,.4s; }

.introduction .text-box .dissapear { -webkit-transform: translateY(20px); -ms-transform: translateY(20px); transform: translateY(20px); opacity: 0; }

.introduction .photo-box .photo .appear { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); -webkit-transition-duration: 1s,1s; -o-transition-duration: 1s,1s; transition-duration: 1s,1s; }

.introduction .photo-box .photo:nth-of-type(1) .dissapear { -webkit-transform: translateX(60px); -ms-transform: translateX(60px); transform: translateX(60px); opacity: 0; }

.introduction .photo-box .photo:nth-of-type(2) .dissapear { -webkit-transform: translateX(-60px); -ms-transform: translateX(-60px); transform: translateX(-60px); opacity: 0; }

.four-point > .section-header .section-title.appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: .8s,1s; -o-transition-duration: .8s,1s; transition-duration: .8s,1s; }

.four-point > .section-header .section-title.dissapear { -webkit-transform: translateY(15px); -ms-transform: translateY(15px); transform: translateY(15px); opacity: 0; }

.ancher-navi .appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: .8s,1s; -o-transition-duration: .8s,1s; transition-duration: .8s,1s; }

.ancher-navi .appear:nth-of-type(1) { -webkit-transition-delay: 0s,0s; -o-transition-delay: 0s,0s; transition-delay: 0s,0s; }

.ancher-navi .appear:nth-of-type(2) { -webkit-transition-delay: .2s,.2s; -o-transition-delay: .2s,.2s; transition-delay: .2s,.2s; }

.ancher-navi .appear:nth-of-type(3) { -webkit-transition-delay: .4s,.4s; -o-transition-delay: .4s,.4s; transition-delay: .4s,.4s; }

.ancher-navi .appear:nth-of-type(4) { -webkit-transition-delay: .6s,.6s; -o-transition-delay: .6s,.6s; transition-delay: .6s,.6s; }

.ancher-navi .dissapear { -webkit-transform: translateY(-12px); -ms-transform: translateY(-12px); transform: translateY(-12px); opacity: 0; }

.four-point-section .appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: 1s,1s; -o-transition-duration: 1s,1s; transition-duration: 1s,1s; }

.four-point-section .dissapear { opacity: 0; }

.four-point-section:nth-of-type(2n) .dissapear { -webkit-transform: translateX(36px); -ms-transform: translateX(36px); transform: translateX(36px); }

.four-point-section:nth-of-type(2n+1) .dissapear { -webkit-transform: translateX(-36px); -ms-transform: translateX(-36px); transform: translateX(-36px); }

.color-valiation .section-header .appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: .8s,1s; -o-transition-duration: .8s,1s; transition-duration: .8s,1s; }

.color-valiation .section-header .dissapear { opacity: 0; -webkit-transform: translateY(30px); -ms-transform: translateY(30px); transform: translateY(30px); }

.clr-vali-navi .appear { opacity: 1; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); -webkit-transition-duration: .8s; -o-transition-duration: .8s; transition-duration: .8s; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; }

.clr-vali-navi .dissapear { -webkit-transform: translateY(-100%); -ms-transform: translateY(-100%); transform: translateY(-100%); opacity: 0; }

#freeplan .appear { opacity: 1; -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); -webkit-transition-duration: .8s; -o-transition-duration: .8s; transition-duration: .8s; -webkit-transition-delay: .2s; -o-transition-delay: .2s; transition-delay: .2s; }

#freeplan h3.dissapear { -webkit-transform: translateX(-40px); -ms-transform: translateX(-40px); transform: translateX(-40px); opacity: 0; }

#freeplan p.dissapear { -webkit-transform: translateX(40px); -ms-transform: translateX(40px); transform: translateX(40px); opacity: 0; }

/*# sourceMappingURL=sourcemaps/style.css.map */