@charset "utf-8";

/* +++++++++++++++++++++++++ setting +++++++++++++++++++++++++ */

:root {
--main-color: #71B5A9;
--black-color: #4f4f4f;
--point-color: #c90c44;
}



/*  +++++++++++++++++++++++++ common +++++++++++++++++++++++++ */

html{
font-size: 100%;
scroll-behavior: smooth;
overflow-wrap: anywhere;
}
body{
margin: 0;
padding: 0;
text-align: center;
font-family: "Zen Maru Gothic", sans-serif;
color: var(--black-color);
-webkit-text-size-adjust: 100%;
font-weight: 500;
height: 100%;
}
.en{
font-family: 'Outfit', sans-serif;
font-weight: 700;
}
.pc{
display: block;
}
.sp{
display: none;
}
#wrapper{
margin: 0;
padding: 0;
}
.movieBox {
margin: 0;
padding: 0;
}
/*#btnTop {
position: fixed;
bottom: 20px;
right: 20px;
}*/
a:hover{
opacity: 0.8;
text-decoration: none;
}
a[href^="tel:"]:hover{
opacity: 1.0;
}
img{
max-width: 100%;
height: auto;
-webkit-backface-visibility: hidden;
}
/*a img{
transition: all 0.3s ease 0s;
}
a:hover img {
transform: scale(1.05, 1.05);
}*/
.svgParts {
display: none;
}
svg {
fill: var(--black-color);
}
a:link{
color: var(--black-color);
text-decoration:underline;
}
a:visited{
color: var(--black-color);
text-decoration:underline;
}
.clear{
clear: both;
}
.clearfix::after {
content: "";
display: block;
clear: both;
}
.ind {
display: block;
text-indent: -1.0em !important;
padding-left: 1.0em !important;
}
.mt0{margin-top:0!important}.mt5{margin-top:5px!important}.mt10{margin-top:10px!important}.mt15{margin-top:15px!important}.mt20{margin-top:20px!important}.mt25{margin-top:25px!important}.mt30{margin-top:30px!important}.mt35{margin-top:35px!important}.mt40{margin-top:40px!important}.mt45{margin-top:45px!important}.mt50{margin-top:50px!important}.mb0{margin-bottom:0!important}.mb5{margin-bottom:5px!important}.mb10{margin-bottom:10px!important}.mb15{margin-bottom:15px!important}.mb20{margin-bottom:20px!important}.mb25{margin-bottom:25px!important}.mb30{margin-bottom:30px!important}.mb35{margin-bottom:35px!important}.mb40{margin-bottom:40px!important}.mb45{margin-bottom:45px!important}.mb50{margin-bottom:50px!important}.pt0{padding-top:0!important}.pt5{padding-top:5px!important}.pt10{padding-top:10px!important}.pt15{padding-top:15px!important}.pt20{padding-top:20px!important}.pt25{padding-top:25px!important}.pt30{padding-top:30px!important}.pt35{padding-top:35px!important}.pt40{padding-top:40px!important}.pt45{padding-top:45px!important}.pt50{padding-top:50px!important}.pb0{padding-bottom:0!important}.pb5{padding-bottom:5px!important}.pb10{padding-bottom:10px!important}.pb15{padding-bottom:15px!important}.pb20{padding-bottom:20px!important}.pb25{padding-bottom:25px!important}.pb30{padding-bottom:30px!important}.pb35{padding-bottom:35px!important}.pb40{padding-bottom:40px!important}.pb45{padding-bottom:45px!important}.pb50{padding-bottom:50px!important}
.pctL {
float: left;
margin-right: 30px !important;
margin-bottom: 30px !important;
}
.pctR {
float: right;
margin-left: 30px !important;
margin-bottom: 30px !important;
}
.aCenter {
text-align: center;
}
.aLeft {
text-align: left;
}
.aRight {
text-align: right;
}
.centered {
position: relative;
overflow: hidden;
}
.centered ul {
position: relative;
left: 50%;
float: left;
}
.centered ul li {
position: relative;
left: -50%;
float: left;
}
a[target="_blank"]:after {
content: "";
margin: 0 5px;
width: 10px;
height: 10px;
display: inline-block;
background: url(../images/ico_blank.png) no-repeat center center / contain;
}
a[href$=".pdf"]:after {
content: "";
margin: 0 5px;
width: 16px;
height: 16px;
display: inline-block;
background: url(../images/ico_pdf.png) no-repeat center center !important;
background-size: contain !important;
}
a[href$=".xlsx"]:after,
a[href$=".xls"]:after {
content: "";
margin: 0 5px;
width: 16px;
height: 16px;
display: inline-block;
background: url(../images/ico_exel.png) no-repeat center center !important;
background-size: contain !important;
}
a[href$=".doc"]:after,
a[href$=".docx"]:after {
content: "";
margin: 0 5px;
width: 16px;
height: 16px;
display: inline-block;
background: url(../images/ico_word.png) no-repeat center center !important;
background-size: contain !important;
}
a[target="_blank"].noIco:after,
a[href$=".pdf"].noIco:after,
a[href$=".xlsx"].noIco:after,
a[href$=".xls"].noIco:after,
a[href$=".doc"].noIco:after,
a[href$=".docx"].noIco:after,
a[target="_blank"]:has(img):after,
a[href$=".pdf"]:has(img):after,
a[href$=".xlsx"]:has(img):after,
a[href$=".xls"]:has(img):after,
a[href$=".doc"]:has(img):after,
a[href$=".docx"]:has(img):after {
content: none;
}



/*  +++++++++++++++++++++++++ table-wrap +++++++++++++++++++++++++ */

.table-wrap{
margin: 0 0 30px;
padding: 0;
position:relative;
}
.table-scroll{
padding: 0 0 10px;
overflow: auto;
white-space: nowrap;
-webkit-overflow-scrolling:touch;
}
.table-scroll::-webkit-scrollbar-track {
background-color: #EEE;
}
.table-scroll::-webkit-scrollbar {
width: 5px;
height: 5px;
background-color: #EEE;
}
.table-scroll::-webkit-scrollbar-thumb {
background-color: #222;
}
.table-scroll table{
margin: 0 !important;
width: auto;
}
.table-arrow{
display:none;
position:absolute;
top:50%;
transform:translateY(-50%);
z-index:10;
width:20px;
height:40px;
border:none;
background:rgba(0,0,0,.4);
color:#fff;
cursor:pointer;
}
.table-arrow::before {
content: '';
width: 6px;
height: 6px;
border-top: solid 2px #FFF;
border-right: solid 2px #FFF;
position: absolute;
left: 50%;
top: 50%;
}
.table-arrow.prev{
left:0;
border-radius: 0 5px 5px 0;
}
.table-arrow.prev::before {
transform: translate(-50%,-50%) rotate(-135deg);
}
.table-arrow.next{
right:0;
border-radius: 5px 0 0 5px;
}
.table-arrow.next::before {
transform: translate(-50%,-50%) rotate(45deg);
}


/*  +++++++++++++++++++++++++ btnTop +++++++++++++++++++++++++ */

#btnTop {
margin: 0;
padding: 0;
height: 50px;
width: 50px;
position: fixed;
right: 20px;
bottom: 20px;
background: var(--main-color);
border-radius: 50%;
box-sizing: border-box;
z-index: 300;
}
#btnTop::before {
margin: 0;
padding: 0;
content: "";
display: inline-block;
height: 10px;
width: 10px;
border-top: 3px solid #FFF;
border-right: 3px solid #FFF;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%,-20%) rotate(-45deg);
}
#btnTop a {
margin: 0;
padding: 0;
display: block;
width: 100%;
height: 100%;
}



/*  +++++++++++++++++++++++++ btnBox +++++++++++++++++++++++++ */

ul.btnBox{
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
}
ul.btnBox.center{
justify-content: center;
}
ul.btnBox.right{
justify-content: flex-end;
}
ul.btnBox li{
margin: 0;
padding: 0 !important;
min-width: 500px;
box-sizing: border-box;
text-align: center;
font-size: 1.25rem;
line-height: 1.8;
text-indent: 0 !important;
background: var(--main-color);
border-radius: 200px;
}
ul.btnBox li+li{
margin-left: 20px;
}
ul.btnBox li a{
margin: 0;
padding: 15px 30px;
display: block;
color: #FFF;
text-decoration: none;
position: relative;
}
ul.btnBox li a[target="_blank"]:after {
background: url(../images/ico_blank_w.png) no-repeat center center / contain;
}
ul.btnBox li a::before {
content: '';
width: 8px;
height: 8px;
border-top: solid 2px #FFF;
border-right: solid 2px #FFF;
position: absolute;
right: 20px;
top: 50%;
transform: rotate(45deg) translateY(-50%);
transition: all 0.3s ease 0s;
}
ul.btnBox li a:hover::before {
right: 15px;
}
ul.btnBox.free li{
min-width: 0;
}
ul.btnBox.small li{
font-size: 1.0rem;
}
ul.btnBox.small li a{
padding: 10px 30px;
}



/*  +++++++++++++++++++++++++ header +++++++++++++++++++++++++ */

#header{
margin: 0;
padding: 0;
}
#header > .inner{
margin: 0 auto;
padding: 30px 0;
width: 1200px;
display: flex;
justify-content: space-between;
align-items: center;
}
@media screen and (max-width:1200px){
#header > .inner{
width: 94%;
}
}
#header h1.logo{
margin: 0;
padding: 0;
display: flex;
align-items: center;
flex-direction: row-reverse;
text-align: left;
}
#header h1.logo img{
margin: 0 15px 0 0;
padding: 0;
width: 230px;
}
#header h1.logo span.txt{
margin: 0;
padding: 0;
font-size: 1.0rem;
line-height: 1.2;
font-weight: 700;
color: #71B5A9;
}
@media screen and (max-width:960px){
#header h1.logo{
display: block;
}
#header h1.logo img{
margin: 0;
}
#header h1.logo span.txt{
margin: 0 0 5px;
display: block;
}
}
#headerContents{
margin: 0;
padding: 0;
display: flex;
flex-wrap: wrap;
align-items: center;
justify-content: flex-end;
}
#headerContents p.produce{
margin: 0;
padding: 0;
display: flex;
align-items: center;
font-size: 0.75rem;
color: #564B3D;
line-height: 1.4;
}
#headerContents p.produce img{
margin: 0 0 0 5px;
padding: 0;
width: 193px;
}
#headerContents p.btn{
margin: 0 0 0 15px;
padding: 0;
border: solid 1px var(--black-color);
border-radius: 200px;
font-size: 0.85rem;
line-height: 1.4;
text-align: center;
}
#headerContents p.btn a{
margin: 0;
padding: 3px 15px;
display: block;
text-decoration: none;
color: var(--black-color);
}



/*  +++++++++++++++++++++++++ mv +++++++++++++++++++++++++ */

#mv{
margin: 0;
padding: 0;
background: url("../images/main.jpg") no-repeat center center;
width: 100%;
height: 800px;
}
#mv > .inner{
margin: 0 auto;
padding: 0;
width: 1200px;
height: 100%;
position: relative;
}
#mv #mvCatch{
margin: 0;
padding: 0;
width: 700px;
position: absolute;
left: 0;
top: 50%;
transform: translateY(-40%);
}
@media screen and (min-width:2000px){
#mv{
background: url("../images/main.jpg") no-repeat center top / cover;
}
}
@media screen and (max-width:1200px){
#mv{
padding: 71.875% 0 0;
background: url("../images/main_sp.jpg") no-repeat center center / cover;
height: 0;
position: relative;
}
#mv > .inner{
margin: 0;
width: 90%;
position: absolute;
left: 50%;
top: 0;
transform: translateX(-50%);
}
#mv #mvCatch{
width: 58%;
}
}




/*  +++++++++++++++++++++++++ omoiBox +++++++++++++++++++++++++ */

#omoiBox {
margin: 0;
padding: 0;
background: url("../images/bg_01.gif");
}
#omoiBox > .inner{
margin: 0 auto;
padding: 100px 0;
width: 1200px;
text-align: left;
}
@media screen and (max-width:1200px){
#omoiBox > .inner{
width: 94%;
}
}
#omoiBox h2 {
margin: 0 0 20px;
padding: 0;
font-size: 2.8rem;
line-height: 1.8;
color: var(--main-color);
text-align: center;
}
#omoiBox p.read {
margin: 0 0 30px;
padding: 0;
font-size: 2.0rem;
font-weight: 700;
line-height: 1.8;
text-align: center;
}
#omoiBox #omoiList {
margin: 0;
padding: 0;
display: flex;
justify-content: space-between;
width: 100%;
}
#omoiBox #omoiList .box {
margin: 0;
padding: 0;
width: 31%;
}
#omoiBox #omoiList .box h3 {
margin: 0 0 20px;
padding: 8px 0;
background: var(--main-color);
font-size: 1.45rem;
font-weight: 700;
line-height: 1.6;
color: #FFF;
text-align: center;
border-radius: 12px;
}
#omoiBox #omoiList .box p {
margin: 0;
padding: 0;
font-size: 1.25rem;
font-weight: 600;
line-height: 1.8;
color: #66988a;
}





/*  +++++++++++++++++++++++++ designBox +++++++++++++++++++++++++ */

#designBox {
margin: 0;
padding: 0;
background: url("../images/bg_02.gif");
overflow-x: hidden;
}
#designBox > .inner{
margin: 0 auto;
padding: 100px 0;
width: 1200px;
text-align: left;
}
@media screen and (max-width:1200px){
#designBox > .inner{
width: 94%;
}
}
#designBox h2 {
margin: 0 0 20px;
padding: 0;
font-size: 2.8rem;
line-height: 1.8;
color: var(--main-color);
text-align: center;
}
#designBox h2 span {
margin: 0;
padding: 0 12px;
position: relative;
display: inline-block;
}
#designBox h2 span::before,
#designBox h2 span::after {
margin: 0;
padding: 0;
content: "";
display: inline-block;
width: 257px;
height: 21px;
background: url("../images/title_line.png") no-repeat center center / contain;
position: absolute;
}
#designBox h2 span::before {
left: 0;
top: 50%;
transform: translate(-100%,-40%);
}
#designBox h2 span::after {
right: 0;
top: 50%;
transform: translate(100%,-40%);
}
#designBox p.pct {
margin: 0 auto 10px;
padding: 0;
text-align: center;
width: 90%;
}
#designBox #designOption {
margin: 0 auto;
padding: 20px 25px;
display: flex;
align-items: center;
justify-content: center;
background: #FFF;
border-radius: 20px;
width: 600px;
box-shadow: 3.536px 3.536px 17.43px 3.57px rgba(203, 226, 222, 0.4);
box-sizing: border-box;
}
#designBox #designOption p.photo {
margin: 0 20px 0 0;
padding: 0;
width: 150px;
}
#designBox #designOption p.txt {
margin: 0;
padding: 0;
font-size: 1.65rem;
font-weight: 600;
line-height: 1.8;
font-weight: 700;
color: #4a9ab7;
text-align: center;
}






/*  +++++++++++++++++++++++++ contentsBox +++++++++++++++++++++++++ */

#contentsBox {
margin: 0;
padding: 0;
background: url("../images/bg_03.gif");
}
#contentsBox > .inner{
margin: 0;
padding: 100px 0;
text-align: left;
}
#contentsBox p.read {
margin: 0 0 50px;
padding: 0;
font-size: 2.0rem;
font-weight: 700;
line-height: 1.8;
text-align: center;
}
#contentsBox .box {
margin: 0 0 0 10%;
padding: 0;
display: flex;
justify-content: space-between;
flex-direction: row-reverse;
width: 90%;
}
#contentsBox .box:nth-child(even) {
margin: 0 10% 0 0;
flex-direction: row;
}
#contentsBox .box+.box {
margin-top: 20px !important;
}
#contentsBox .box .photoBox {
margin: 0;
padding: 0;
width: 55.5%;
min-height: 600px;
border-radius: 15px 0 0 15px;
}
#contentsBox .box:nth-child(even) .photoBox {
border-radius: 0 15px 15px 0;
}
#contentsBox .box:nth-of-type(1) .photoBox {
background: url("../images/contents_photo_01.jpg") no-repeat center center / cover;
}
#contentsBox .box:nth-of-type(2) .photoBox {
background: url("../images/contents_photo_02.jpg") no-repeat center center / cover;
}
#contentsBox .box:nth-of-type(3) .photoBox {
background: url("../images/contents_photo_03.jpg") no-repeat center center / cover;
}
#contentsBox .box .txtBox {
margin: 0;
padding: 0;
width: 40%;
box-sizing: border-box;
text-align: left;
display: flex;
flex-direction: column;
justify-content: center;
}
#contentsBox .box .txtBox h2 {
margin: 0 0 20px;
padding: 0;
font-size: 2.0rem;
line-height: 1.6;
text-align: center;
}
#contentsBox .box .txtBox p {
margin: 0;
padding: 0;
font-size: 1.25rem;
line-height: 2.0;
width: 100%;
}
#contentsBox .box .txtBox p.ico {
margin: 0 auto 10px;
padding: 0;
width: 100px;
}






/*  +++++++++++++++++++++++++ summaryBox +++++++++++++++++++++++++ */

#summaryBox {
margin: 0;
padding: 0;
}
#summaryBox > .inner{
margin: 0 auto;
padding: 60px 0;
width: 1200px;
text-align: left;
}
@media screen and (max-width:1200px){
#summaryBox > .inner{
width: 94%;
}
}
#summaryBox h2 {
margin: 0 0 30px;
padding: 0;
font-size: 2.8rem;
line-height: 1.8;
color: var(--main-color);
text-align: center;
}



/*  +++++++++++++++++++++++++ companyBox +++++++++++++++++++++++++ */

#companyBox {
margin: 0;
padding: 0;
border-top: solid 3px var(--main-color);
}
#companyBox > .inner{
margin: 0 auto;
padding: 60px 0;
width: 1200px;
text-align: left;
}
@media screen and (max-width:1200px){
#companyBox > .inner{
width: 94%;
}
}
#companyBox h2 {
margin: 0 0 20px;
padding: 0;
font-size: 2.8rem;
line-height: 1.8;
color: var(--main-color);
text-align: center;
}
#companyBox p.logo {
margin: 0 auto 30px;
padding: 0;
width: 500px;
text-align: center;
}




/*  +++++++++++++++++++++++++ cvBox +++++++++++++++++++++++++ */

#cvBox {
margin: 0;
padding: 0;
background: url("../images/bg_04.gif");
}
#cvBox h2 {
margin: 0 0 30px;
padding: 0;
font-size: 2.8rem;
line-height: 1.8;
color: #FFF;
text-align: center;
}
#cvBox > .inner{
margin: 0 auto;
padding: 100px 0;
width: 1200px;
text-align: left;
}
@media screen and (max-width:1200px){
#cvBox > .inner{
width: 94%;
}
}
#cvBox ul.btnBox {
width: 100%;
}
#cvBox ul.btnBox li {
font-size: 1.45rem;
font-weight: 700;
min-width: 0;
width: 100%;
background: #FFF;
}
#cvBox ul.btnBox li a {
padding: 20px 30px;
color: var(--main-color);
}
#cvBox ul.btnBox li a[target="_blank"]:after {
background: url(../images/ico_blank.png) no-repeat center center / contain;
}
#cvBox ul.btnBox li a span:before {
margin: 0 8px 0 0;
padding: 0;
content: "";
display: inline-block;
width: 39px;
height: 25px;
background: url("../images/ico_mail.png") no-repeat center center;
background-size: contain;
vertical-align: center;
position: relative;
top: 3px;
}
#cvBox ul.btnBox li a::before {
border-top-color: var(--main-color);
border-right-color: var(--main-color);
}



/*  +++++++++++++++++++++++++ mapBox +++++++++++++++++++++++++ */

#mapBox {
margin: 0;
padding: 0;
}



/*  +++++++++++++++++++++++++ footer +++++++++++++++++++++++++ */

#footer{
margin: 0;
padding: 0;
}
#footer > .inner{
margin: 0 auto;
padding: 30px 0;
width: 1200px;
display: flex;
justify-content: space-between;
align-items: center;
}
@media screen and (max-width:1200px){
#footer > .inner{
width: 94%;
}
}
#footer p.logo{
margin: 0;
padding: 0;
width: 230px;
}
#footer p#copy{
margin: 0;
padding: 0;
font-size: 0.91rem;
line-height: 1.3;
}



/*  +++++++++++++++++++++++++ page +++++++++++++++++++++++++ */

.page{
margin: 0;
padding: 0;
text-align: left;
}
.page > *:last-child {
margin-bottom: 0 !important;
}
.page table.tblNormal {
margin: 0;
padding: 0;
width: 100%;
clear: both;
border-bottom: solid 1px #e0e0e0;
}
.page table.tblNormal tr {
border-top: solid 1px #e0e0e0;
}
.page table.tblNormal th,
.page table.tblNormal td {
margin: 0;
padding: 20px 0 20px 20px;
font-size: 1.125rem;
line-height: 1.8;
box-sizing: border-box;
}
.page table.tblNormal th {
padding-left: 0;
font-weight: 700;
white-space: nowrap;
}
.page table.tblBorder {
margin: 0 0 30px;
padding: 0;
width: 100%;
clear: both;
}
.page table.tblBorder th,
.page table.tblBorder td{
margin: 0;
padding: 8px;
font-size: 1.125rem;
line-height: 1.3;
box-sizing: border-box;
border: solid 3px var(--black-color);
}
.page table.tblBorder td .ss{
font-size: 0.81em;
}
.page table.tblBorder tr:nth-child(odd) td{
background: #f0f0f0;
}
.page table.tblBorder th {
padding: 15px 8px;
font-size: 1.25rem;
font-weight: 700;
color: #FFF;
background: #707070;
}
.page table.tblBorder td ul.btn{
margin: 0;
padding: 0;
}
.page table.tblBorder td ul.btn li{
margin: 0;
padding: 0;
background: #ec005b;
border-radius: 6px;
font-size: 1.0rem;
font-weight: 700;
text-align: center;
}
.page table.tblBorder td ul.btn li:nth-of-type(2){
background: #18b603;
}
.page table.tblBorder td ul.btn li+li{
margin-top: 5px;
}
.page table.tblBorder td ul.btn li a{
margin: 0;
padding: 5px;
display: block;
text-decoration: none;
color: #FFF;
}
.page table.tblBorder td ul.btn li a::after{
content: none !important;
}
.page table.tblStripe {
margin: 0;
padding: 0;
width: 100%;
clear: both;
}
.page table.tblStripe tr {
background: #FFF;
}
.page table.tblStripe tr:nth-child(odd) {
background: #e0e0e0;
}
.page table.tblStripe th,
.page table.tblStripe td {
margin: 0;
padding: 15px 20px 15px 40px;
font-size: 1.0rem;
line-height: 1.8;
box-sizing: border-box;
vertical-align: middle;
}
.page table.tblStripe th {
padding: 15px 0 15px 40px;
color: var(--black-color);
}
.page table.tblNormal th > *:last-child,
.page table.tblNormal td > *:last-child,
.page table.tblBorder th > *:last-child,
.page table.tblBorder td > *:last-child,
.page table.tblStripe th > *:last-child,
.page table.tblStripe td > *:last-child {
margin-bottom: 0;
}
.page table.tblNormal.fix,
.page table.tblBorder.fix,
.page table.tblStripe.fix {
table-layout: fixed;
}
.page table.tblNormal .nw,
.page table.tblBorder .nw,
.page table.tblStripe .nw {
white-space: nowrap;
}
.page table.summary th {
width: 220px;
}
.page ul.point01 {
margin: 0 0 30px;
padding: 0;
}
.page ul.point01 li {
margin: 0 0 5px;
padding: 0 0 0 1.0em;
font-size: 1.0rem;
line-height: 1.8;
text-indent: -1.0em;
}
.page ul.point01 li:last-child {
margin-bottom: 0;
}
.page ul.point01 li::before{
margin: 0 8px 0 0;
padding: 0;
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 5px 0 5px 7px;
border-color: transparent transparent transparent var(--black-color);
display:  inline-block;
vertical-align:  middle;
position:  relative;
top: -2px;
}
.page ol {
margin: 0 0 30px;
padding: 0;
list-style: none;
counter-reset: li;
}
.page ol li {
margin: 0 0 10px;
padding: 0 0 0 1.6em;
font-size: 1.0rem;
line-height: 1.6;
position: relative;
}
.page ol li::before {
counter-increment: li;
content: counter(li);
position: absolute;
left: 0;
top: 2px;
display: block;
width: 20px;
height: 20px;
border-radius: 50%;
background-color: var(--black-color);
font-size: 12px;
color: #fff;
line-height: 20px;
text-align: center;
}