@charset "UTF-8";
/*
    Template: swell
    Theme Name: Unix Innovation Inc.
    Description: SWELLの子テーマ
*/

/* ========== Default Settings ========== */
html{font-size:100%;}
:root{font-size: clamp(0.45rem, 1vw, 1rem);}
.headline{font-size: 2.25rem;text-align:center;}
.subhead{font-size: 2.3rem;text-align:center;}
p{font-size: 2rem;line-height: 1.8;}
a:hover{opacity:0.7;}
.site-main{z-index:-1;position: relative;}

/* ========== header ========== */
.lp-head{width:100%;padding: 1rem 2rem;}
.l-header{display:none;}
.l-content{padding: 0;width: 100%;max-width:800px;margin-bottom:0;}
.lp-head-inner{display: flex;justify-content: space-between;align-items: center;background-color: #FFF;}
.lp-head-inner h1{font-size: 2rem;font-weight: 400;line-height:1;}
.lp-head-inner .area img{width: 12rem;display: block;}

/* ========== MainVisual ========== */
.mainvisual{background-color: #F5F6FA;width: 100%;}
.mainvisual-inner{display: flex;flex-flow: column;padding-bottom: 2.65rem;}
.mainvisual-inner .second,.mainvisual-inner .third{padding: 0 2rem;}
.mainvisual-inner .third{margin-top: 1rem;}

/* ========== Contact ========== */
.contact-inner{padding: 2.65rem 2rem;display: flex;flex-flow: column;gap: 1rem;}
.contact-inner p{text-align:center;line-height: 1;}

/* ========== Reasons ========== */
.reasons-inner{padding: 2.65rem 2rem;}
.reasons-inner h2{line-height: 1.2;padding-bottom:2.65rem;}
.reasons-inner h2 span{color: #E12D30;font-size: 3.195rem;}
.label{background-color: #E12D30;width: 100%;display: block;text-align: center;color: #FFF;font-weight: 600;font-style: italic;font-size: 1.65rem;line-height: 1.2;}
.number{font-size: 4rem;color: #E12D30;text-align: center;display: block;font-style: italic;font-weight: 600;line-height: 1.2;}
.reasons-point{margin-bottom: 2.65rem;}
.reasons-point h3{margin-bottom: 1rem;}

/* ========== Merit ========== */
.merit-inner{padding: 0 2rem;}
.merit-inner .arrow{width: 3.325rem;display: block;margin: 0 auto;padding: 2rem 0;}
.merit-inner h2{line-height: 1.2;margin-bottom: 4rem;}
.merit-inner h2 span,.appeal{position: relative;color: #E12D30;font-size: 2.5rem;display: inline-block;}
.merit-inner h2 span::after,.appeal::after{content: "";position: absolute;left: 0;bottom: 0;width: 100%;height: 1rem;background-color: #F2D431;z-index: -1;}
.merit-inner h3{font-size: 3.195rem;}
.merit-inner h3 span{font-size: 2.65rem;}
.merit-details .label{background-color: unset;color: #E12D30;line-height: 1;}
.merit-details .number{line-height: 1;}
.merit-container{border: solid 1px #E12D30;border-radius: 1.6rem;padding:2.65rem;margin-top: 1.5rem;}
.merit-details h3{font-size:2.4rem;margin-top: .5rem;}
.merit-details img{width: 20rem;display: block;margin: 2rem auto;}
.merit-container hr{border: none;border-bottom: solid 1px #E12D30;margin: 2.65rem 0;}

/* ========== System ========== */
.system-inner h2,.results-inner h2,.company-inner h2,.overview-inner h2,.form-inner h2{font-size: 3rem;margin-bottom: 1rem;}
.horizontal-line {display: flex;align-items: center;gap: 1rem;}
.horizontal-line hr {flex: 1;height: 1px;border: none;background: #1C60CC;}
.horizontal-line .subhead {color: #1C60CC;margin: 0;white-space: nowrap;}
.system-inner{padding: 4rem 2rem;}
.system-inner h4{font-size: 2rem;font-weight: 400;text-align: center;}
.system-inner img{margin: 1.5rem 0 1rem;}

/* ========== results & Carousel ========== */
.results{background-color: #EEEEEE;z-index: -1;position: relative;}
.results-inner{padding: 4rem 2rem;}
.results-carousel {position: relative;overflow:hidden;}
.carousel-item {position:absolute;top:0;left:0;width: 100%;transition: transform 0.6s ease, opacity 0.6s ease;}
.carousel-item.active {position: relative;z-index:1;}
.item-box {background: #FFF;border-radius: 1rem;overflow: hidden;}
.item-img {position: relative;width: 100%;height: 24rem;}
.item-img img {width: 100%;height: 100%;object-fit: cover;border-radius: 1rem 1rem 0 0;}
.item-cat {position: absolute;top: 0;left: 0;background: rgba(28, 96, 204, 0.9);color: #FFF;padding: 0.5rem 1rem;font-size: 2rem;border-radius: 1rem 0 0 0;}
.item-body {padding: 1rem 2rem;}
.item-location {font-size: 2rem;margin: 0 0 0.5rem;}
.item-body hr {border: none;border-bottom: 1px solid #CCCCCC;margin: 0.5rem 0;}
.item-meta {list-style: none;padding: 0;margin: 0;}
.item-meta li {margin-bottom: 0.25rem;font-size: 2rem;}
.carousel-nav {position: absolute;top: 50%;transform: translateY(-50%);background: transparent;border: none;font-size: 4rem;color: #1C60CC;cursor: pointer;z-index: 10;padding: 0;}
.carousel-nav.prev { left: 0; }
.carousel-nav.next { right: 0; }
.carousel-indicators {text-align: center;margin-top: 2rem;}
.indicator {display: inline-block;width: 2rem;height: 2rem;margin: 0 0.5rem;background: #BBBBBB;border-radius: 50%;cursor: pointer;}
.indicator.active {background: #1C60CC;}
.appeal{line-height: 1.4;left: 50%;transform: translateX(-50%);font-weight: 600;margin-top: 2.65rem;}

/* ========== Company ========== */
.company-inner{padding: 4rem 2rem 2rem;}

/* ========== Overview ========== */
.overview-inner{padding:2rem 2rem 4rem;}
.overview-table{width:100%;border-collapse:collapse;}
.overview-table th,.overview-table td{padding:1.5rem;font-size:2rem;line-height:1.6;border: 2px solid #FFF;}
.overview-table th{background:#EEEEEE;font-weight:600;width:26%;vertical-align:middle;text-align:left;}
.overview-table td{background:#F5F5F5;}
.overview-table .map{padding:0;margin-top: 1rem;}
.overview-table iframe{display:block;width:100%;height:240px;}
.overview-table tr:first-child th{border-radius: 1rem 0 0 0;}
.overview-table tr:first-child td{border-radius: 0 1rem 0 0;}
.overview-table tr:last-child th{border-radius: 0 0 0 1rem;}
.overview-table tr:last-child td{border-radius: 0 0 1rem 0;}

/* ========== Form ========== */
.form-inner{background-color: #E12D30;padding: 4rem 2rem;}
.form-inner h2,.form-inner p{color: #FFF;}
.form-inner h2{margin-bottom:2rem;}
.contact-lead{position:relative;padding-right:18rem;padding-bottom:4rem;font-size:1.75rem;line-height:1.8;margin-top: 2.5rem;}
.contact-lead__img{position:absolute;right:0;bottom:0;width:16rem;height:auto;}
.contact-form{background-color: #FFF;border-radius:1rem;padding:2rem;}
.contact-section{padding:4rem 0;background:#f7f7f7;}
.contact-section .inner{max-width: 760px;margin: 0 auto;padding: 0 1.5rem;}
.contact-form{width:100%;}
.contact-form .form-row{margin-bottom:1.8rem;position:relative;}
.contact-form .field-label{display:block;font-weight:700;margin-bottom:.4rem;font-size: 2rem;}
.contact-form .required-dot{display:inline-block;width:.5rem;height:.5rem;background:#E12D30;border-radius:50%;margin-left:.3rem;}
.contact-form .required-text{font-size: 1.5rem;color:#E12D30;}
.contact-form input,.contact-form textarea{width:100%;padding:.75rem 1rem;font-size:2rem;border:1px solid #ddd;border-radius:4px;background-color: #FFF;}
.contact-form textarea{min-height:10em;resize:vertical;}
.contact-form .error-message{font-size:.8rem;color:#E12D30;margin-top:.3rem;display:none;}
.contact-form .has-error .error-message{display:block;}
.contact-form .has-error input,.contact-form .has-error textarea{border-color:#E12D30;}
.contact-form .submit-area{text-align:center;margin-top:2.5rem;}
.form-row label{display: flex;align-items: center;gap: .5rem;}
.submit-area i{position: absolute;right: 0;transform: translateY(-50%);top: 50%;right: 2rem;}
.submit-area button{border: none;background-color: unset;}
.submit-area button:hover{opacity:0.7;}

/* Chrome, Safari, Opera */
.contact-form input::placeholder,.contact-form textarea::placeholder {color: #aaa;}
/* Firefox 19+ */
.contact-form input::-moz-placeholder,.contact-form textarea::-moz-placeholder {color: #aaa;opacity: 1;}
/* Firefox 4–18 */
.contact-form input:-moz-placeholder,.contact-form textarea:-moz-placeholder {color: #aaa;}
/* Internet Explorer 10+ */
.contact-form input:-ms-input-placeholder,.contact-form textarea:-ms-input-placeholder {color: #aaa;}
/* Edge */
.contact-form input::-ms-input-placeholder,.contact-form textarea::-ms-input-placeholder {color: #aaa;}

/* ========== Thanks ========== */
.p-breadcrumb{display:none;}
.thanks-inner{background-color: #F5F6FA;padding: 4rem 2rem;}
.thanks-inner p{background-color: #F5F6FA;padding: 2rem;}
.thanks-inner .back-home{font-size: 2rem;padding: 2rem;}
.thanks-inner h2{font-size: 3rem;}

/* ========== Footer ========== */
.l-footer{margin-bottom: 6.5rem;}
.l-footer .copyright{font-size: 1.75rem;}
.footer-contact {position: fixed;bottom: 0;left: 50%;width: 100%;display: flex;background: #fff;padding:0;z-index: 999;transform: translateX(-50%);max-width:800px;}
.footer-contact img{display: block;}