@charset "utf-8";

/* RESET
---------------------------------------- */
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;}

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

ul,ol {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; outline:none;}

del {text-decoration:line-through;}

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

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

input, select {vertical-align:middle;}

img {vertical-align:bottom; border:none; font-size:0; line-height:0;}

em {font-style:normal;}

body {-webkit-text-size-adjust:none;}

address {font-style:normal;}

* {box-sizing: border-box;}

/*
 *	COMMON CLASS
 *
 *------------------------------------*/

body {font-size: 4vw; line-height: 1.8;}

sup {font-size: 0.5em; vertical-align: super;}

.tac {text-align: center;}

.error {color: #F00; font-weight: bold;}

/* 
 * 共通レイアウト
 * ------------------------- */

header {position: fixed; left: 0; top: 0; z-index: 9999; width: 100%; height: 15vw; background: rgba(255,255,255,0.8)}
.header-inner {width: 100vw; margin: 0 auto;}
.header-logo {float:left; padding-left: 2vw;}
.header-logo img {width: 32.5vw;}
.header-nav {display: none;}
.header-toggle-sp-nav {position: relative; float: right; width: 15vw; height: 15vw; padding: 0; border: none; background: none;}
.header-toggle-sp-nav span {position: absolute; display: block; width: 9vw; height: 1vw; left: 3vw; top: 7vw; background: #000;}
.header-toggle-sp-nav::before {content: ""; position: absolute; display: block; width: 9vw; height: 1vw; left: 3vw; top: 4.5vw; background: #000;}
.header-toggle-sp-nav::after {content: ""; position: absolute; display: block; width: 9vw; height: 1vw; left: 3vw; top: 9.5vw; background: #000;}
.header-sp-nav {display: none; position: fixed; left: 0; top: 15vw; z-index: 9999; width: 100vw; background: #FFF; border-top: 1px solid #74bca5;}
.header-sp-nav-item {padding: 3vw; text-align: center; border-bottom: 1px solid #74bca5;}
.header-sp-nav-item a {display: block; color: #000; text-decoration: none; font-size: 5vw;}
.header-sp-nav-phone {display: block; float: left; width: 50vw; height: 16vw; padding-left: 10vw; line-height: 16vw; font-size: 4vw; font-weight: bold; background: #74bca5 url('./images/icon-phone-w.png') 4vw 50% no-repeat; background-size: 4vw 4vw; color: #FFF; text-decoration: none;}
.header-sp-nav-inquiry {display: block; float: left; width: 50vw; height: 16vw; padding-left: 10vw; line-height: 16vw; font-size: 4vw; color: #FFF; text-decoration: none; background: #ed9e16 url('./images/icon-mail.png') 4vw 50% no-repeat; background-size: 4vw 3.2vw;}

.show-nav {background: #FFF;}
.show-nav .header-sp-nav {display: block;}
.show-nav .header-toggle-sp-nav span {display: none;}
.show-nav .header-toggle-sp-nav::before {top: 7vw; transform:rotate(-45deg);}
.show-nav .header-toggle-sp-nav::after {top: 7vw; transform:rotate(45deg);}


.footer-inquiry-title {display: none;}
.footer-inquiry-inner::after {content: ""; display: block; clear: both;}
.footer-inquiry-content {float: left; width: 50vw;}
.footer-inquiry-content-address {display: none;}
.footer-inquiry-content-phone {display: block; height: 15vw; padding-left: 10vw; line-height: 15vw; font-size: 4vw; font-weight: bold; background: url('./images/icon-phone.png') 4vw 50% no-repeat; background-size: 4vw 4vw; border-top: 1px solid #cccccc; color: #000; text-decoration: none;}
.footer-inquiry-link {float: left; width: 50vw;}
.footer-inquiry-link-button {display: block; height: 15vw; padding-left: 10vw; line-height: 15vw; font-size: 4vw; color: #FFF; text-decoration: none; background: #ed9e16 url('./images/icon-mail.png') 4vw 50% no-repeat; background-size: 4vw 3.2vw;}

.footer-branding {padding: 5vw; background: #74bca5; text-align: center; color: #FFF;}
.footer-branding-logo {margin-bottom: 2vw;}
.footer-branding-logo img {width: 45vw;}
.footer-branding-catch {margin-bottom: 3vw; font-size: 4vw; letter-spacing: 1vw;}

.button01 {display: inline-block; width: 80vw; height: 15vw; padding: 5vw; text-align: center; line-height: 5vw; border: 1px solid #74bca5; border-radius: 5px; background: #FFF url('./images/icon-arrow-r.png') 5vw 50% no-repeat; font-size: 4vw; color: #74bca5; text-decoration: none;}


/* 
 * HOME
 * ------------------------- */

.home-main-sp {position: relative; width: 100vw; height: 106.67vw;}
.home-main-sp img {display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: auto;}
.home-main-sp img.active {z-index: 2;}
.home-main {display: none;}

.home-section01 {background: url('./images/home-section01-bg.jpg') 50% 50%; background-size: cover;}
.home-section01-inner {position: relative;}
.home-section01-image {position: relative; z-index: 1; width: 35vw; margin: 0 auto; padding: 45vw 0 10vw; }
.home-section01-image img {width: 40vw;}
.home-section01-content {position: absolute; left: 0; top: 0; z-index: 2; padding: 15vw 10vw;}
.home-section01-content-title {margin-bottom: 8vw; text-align: center; font-size: 8vw; font-family: serif; font-weight: normal;}
.home-section01-content-description {margin-bottom: 25vw; font-size: 4vw;}
.home-section01-content-link {text-align: center;}

.home-section02 {padding: 10vw 0;}
.home-section02-inner {width: 100vw; margin: 0 auto;}
.home-section02-block {position: relative; margin-bottom: 7vw; padding-top: 14vw;}
.home-section02-block::before {content: ""; position: absolute; left: 36vw; top: 0; z-index: 1; width: 28vw; height: 28vw; border-radius: 14vw; background: linear-gradient(to bottom, #91d1e6, #ee9d14);}
.home-section02-block::after {content: ""; position: absolute; left: calc(36vw + 1px); top: 1px; z-index: 2; width: calc(28vw - 2px); height: calc(28vw - 2px); border-radius: calc(14vw - 1px); background: #FFF;}
.home-section02-block-title {position: absolute; left: calc(36vw + 1px); top: 1px; z-index: 4; width: calc(28vw - 2px); height: calc(28vw - 2px); border-radius: calc(14vw - 1px); background: rgba(255,255,255,0.5);}
.home-section02-block-title span {display: block; position: absolute; top: 50%; width: 100%; text-align: center; transform: translateY(-50%); line-height: 7vw; font-size: 7vw; font-family: serif; font-weight: normal;}
.home-section02-block-image {position: relative; z-index: 3; margin-bottom: 4vw; text-align: center;}
.home-section02-block-image img {width: 60vw;}
.home-section02-block-description {padding: 0 10vw; font-size: 4vw;}
.home-section02-link {text-align: center;}

.home-section03 {padding: 8vw 4vw; background: linear-gradient(to right, #ecf6f7, #fbf2e2);}
.home-section03-inner {width: 92vw; margin: 0 auto;}
.home-section03-block {position: relative; margin-bottom: 5vw; padding: 30vw 5vw 10vw; background: #FFF; border-radius: 5px;}
.home-section03-block:last-child {margin-bottom: 0;}
.home-section03-block::after {content: ""; display: block; clear: both;}
.home-section03-block-01-content {margin-bottom: 5vw;}
.home-section03-block-01-image img {width: 100%;}
.home-section03-block-02-content {margin-bottom: 5vw;}
.home-section03-block-02-image img {width: 100%;}
.home-section03-block-content-title {position: absolute; top: 10vw; left: 50%; transform: translateX(-50%);  height: 14vw; padding-left: 18vw; line-height: 14vw; font-size: 8vw; font-family: serif; font-weight: normal;}
.home-section03-block-content-title::before {content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 14vw; height: 14vw; border-radius: 7vw; background: linear-gradient(to bottom, #91d1e6, #ee9d14);}
.home-section03-block-content-title span {position: absolute; left: 2px; top: 2px; z-index: 2; width: calc(14vw - 4px); height: calc(14vw - 4px); border-radius: calc(7vw - 2px); line-height: calc(14vw - 4px); text-align: center; background: #FFF;}
.home-section03-block-01-content p {margin-bottom: 5vw;}
.home-section03-block-01-content table,
.home-section03-block-01-content tbody,
.home-section03-block-01-content tr,
.home-section03-block-01-content th,
.home-section03-block-01-content td {display: block;}
.home-section03-block-01-content table {border-top: 1px solid #cccccc;}
.home-section03-block-01-content th,
.home-section03-block-01-content td {padding: 1vw 4vw; border-left: 1px solid #cccccc; border-bottom: 1px solid #cccccc; border-right: 1px solid #cccccc;}
.home-section03-block-01-content th {background: #eeeeee; text-align: left; font-weight: normal;}
.home-section03-link {margin-top: 10vw; text-align: center;}

.home-section04-image {width: 100vw; height: 120vw; background: url('./images/home-section04-image01.jpg'); background-size: cover;}
.home-section04-content {padding: 7vw;}
.home-section04-content-title {margin-bottom: 5vw; text-align: center;}
.home-section04-content-title h2 {display: inline-block; padding: 1vw; border-bottom: 1px solid #000; font-size: 4vw;}
.home-section04-content-description p {margin-bottom: 5vw;}
.home-section04-content-description table,
.home-section04-content-description tbody,
.home-section04-content-description tr,
.home-section04-content-description th,
.home-section04-content-description td {display: block;}
.home-section04-content-description table {border-top: 1px solid #cccccc;}
.home-section04-content-description th,
.home-section04-content-description td {padding: 1vw 4vw; border-left: 1px solid #cccccc; border-bottom: 1px solid #cccccc; border-right: 1px solid #cccccc;}
.home-section04-content-description th {background: #eeeeee; text-align: left; font-weight: normal;}


/* 
 * 下層
 * ------------------------- */

.content-subpage {padding-top: 15vw;}
.page-title {margin: 0 10px; height: 15vw; line-height: 15vw; text-align: center; background: linear-gradient(to right, #74bca5, #ed9e16); font-size: 5vw; letter-spacing: 1.5vw; color: #FFF; font-weight: normal; font-family: serif; border-radius: 1vw;}
.section-subpage {padding: 8vw 0 12vw; border-bottom: 1px solid #cccccc;}
.section-subpage:last-child {border-bottom: none;}
.section-subpage-inner {width: calc(100vw - 20px); margin: 0 auto;}
.section-title {position: relative; margin-bottom: 5vw; padding: 1vw 0; font-size: 5vw; font-weight: normal; font-family: serif;}
.section-title span {display: inline-block; position: relative; top: -2px; margin-right: 2vw; padding: 0 2vw; line-height: 5vw; background: #74bca5; color: #fff; font-size: 4vw; border-radius: 0.5vw; vertical-align: middle;}
.section-title sub {font-size: 2vw;}
.section-title::after {content: ""; position: absolute; left: 0; bottom: 0; display: block; width: 100%; height: 2px; background: linear-gradient(to right, #74bca5, #ed9e16);}

.products-section01-block01 {margin-bottom: 10vw;}
.products-section01-block02 {margin-bottom: 10vw}
.products-section01-block03 {}
.products-section01-image {display: block; width: 70vw; margin: 0 auto 4vw;}
.products-section01-title {margin-bottom: 4vw; text-align: center; font-size: 5vw; font-weight: normal; font-family: serif;}
.products-section01 table {width: 100%; font-size: 3.5vw;}
.products-section01 th {width: 45%; padding: 1vw 2vw; border: 1px solid #cccccc; background: #eeeeee;}
.products-section01 td {padding: 1vw 2vw; border: 1px solid #cccccc;}
.products-section01-block04 {padding-top: 6vw; text-align: center;}
.products-section01-block04 a {display: inline-block; width: 80vw; padding: 3vw; color: #fff; font-size: 5vw; background: #74bca5 url('./images/icon-arrow-w.png') 5vw 50% no-repeat; background-size: 2vw 3.5vw; border-radius: 2vw; border: none; text-decoration: none;}

.products-section03-block {margin-bottom: 5vw; padding: 5vw 5vw 5vw 15vw; border: 1px solid #cccccc;}
.products-section03-block-question {position: relative; margin-bottom: 2vw; line-height: 7vw; font-size: 5vw; font-weight: bold;}
.products-section03-block-question span {position: absolute; left: -10vw; top: 0; display: block; width: 7vw; height: 7vw; text-align: center; background: #74bca5; color: #fff; font-family: serif; border-radius: 1vw;}
.products-section03-block-answer {}

.products-section04-block {margin-bottom: 5vw;}
.products-section04-block-image {margin-bottom: 3vw;}
.products-section04-block-image img {width: 100%;}
.products-section04-note {position: relative; padding-left: 5vw;}
.products-section04-note::before {content: "※"; position: absolute; left: 0;}
 
.data-section01 p {margin-bottom: 5vw;}
.data-section01-block {margin-bottom: 5vw;}
.data-section01-block-title {margin-bottom: 5vw;}
.data-section01-block-title h3 {width: 25vw; padding-bottom: 1vw; text-align: center; font-size: 5vw; border-bottom: 1px solid #000;}
.data-section01-block-body h4 {margin-bottom: 2vw;}
.data-section01-block-body table {width: 100%; margin-bottom: 2vw; table-layout: fixed; font-size: 3.5vw;}
.data-section01-block-body th {padding: 0.5vw 1vw; border: 1px solid #cccccc; background: #eeeeee; font-size: 3.5vw;}
.data-section01-block-body td {padding: 0.5vw 1vw; border: 1px solid #cccccc; text-align: center;}

.case-section01-block {margin-bottom: 8vw;}
.case-section01-block-image {width: 60vw; margin: 0 auto 3vw;}
.case-section01-block-image img {width: 100%;}
.case-section01-block-title {position: relative; margin-bottom: 3vw; text-align: center;}
.case-section01-block-title h2 {font-size: 5vw; font-weight: normal; font-family: serif;}
.case-section01-block-title::before {content: ""; position: absolute; left: 0; top: -19vw; z-index: 1; width: 16vw; height: 16vw; border-radius: 8vw; background: linear-gradient(to bottom, #91d1e6, #ee9d14);}
.case-section01-block-title span {position: absolute; left: 1px; top: calc(-19vw + 1px); z-index: 2; width: calc(16vw - 2px); height: calc(16vw - 2px); padding-top: 2vw; border-radius: calc(8vw - 1px); background: #FFF; text-align: center; line-height: 5vw; font-family: serif; font-size: 3vw;}
.case-section01-block-title span em {display: block; line-height: 6vw; font-size: 6vw;}

.inquiry-section01-lead {margin-bottom: 8vw; line-height: 2;}
.inquiry-section01-lead em {font-weight: bold; color: #74bca5;}
.inquiry-section01-lead a {color: #74bca5;}
.inquiry-section01-phone {margin: 0 auto 8vw; padding: 3vw; background: linear-gradient(to right, #ecf6f7, #fbf2e2);}
.inquiry-section01-phone-inner {padding: 5vw 2vw 4vw; background: #ffffff; text-align: center;}
.inquiry-section01-phone-number {padding-left: 8vw; display: inline-block; color: #000; text-decoration: none; font-weight: bold; font-size: 6vw; background: url('./images/icon-phone.png') 0 50% no-repeat; background-size: 6vw 6vw;}
.inquiry-section01-form {margin-bottom: 8vw;}
.inquiry-section01-form-row {margin-bottom: 4vw;}
.inquiry-section01-form-label {font-weight: bold; margin-bottom: 2vw;}
.inquiry-section01-form-label .required {display: inline-block; position: relative; top: -1px; margin-left: 1vw; padding: 0 1vw; line-height: 4vw; background: #ff0000; color: #ffffff; font-size: 3vw; border-radius: 1vw;}
.inquiry-section01-form-control input {width: 100%; padding: 3vw; border: 1px solid #cccccc; font-size: 16px;}
.inquiry-section01-form-control input[type="number"] {width: 30vw; padding: 3vw; border: 1px solid #cccccc; font-size: 16px;}
.inquiry-section01-form-control textarea {width: 100%; height: 40vw; padding: 3vw; border: 1px solid #cccccc; font-size: 16px;}
.inquiry-section01-button {margin-bottom: 8vw; text-align: center;}
.inquiry-section01-button button,
.inquiry-section01-button a {display: inline-block; width: 80vw; padding: 3vw; color: #fff; font-size: 5vw; background: #74bca5 url('./images/icon-arrow-w.png') 5vw 50% no-repeat; background-size: 2vw 3.5vw; border-radius: 2vw; border: none; text-decoration: none;}
.inquiry-section01-back {margin-bottom: 8vw; text-align: center;}
.inquiry-section01-back a {display: inline-block; width: 80vw; padding: 3vw; color: #fff; font-size: 5vw; background: #888888; border-radius: 2vw; border: none; text-decoration: none;}

.notation-section01 table {width: 100%;}
.notation-section01 th {width: 30%; padding: 1vw 2vw; border: 1px solid #CCC; background: #EEE; text-align: left;}
.notation-section01 td {padding: 1vw 2vw; border: 1px solid #CCC; text-align: left;}