@charset "utf-8";
/* CSS Document */

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

index

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
#union.index .pageTitle, #union.index  .hA  {background: var(--c-orange);}
#union.index {background: var(--bg-base);}
#union #mainContent {width: 100% !important;}

.wrapContent {margin: min(8vw,70px) auto;}
.hA {margin-bottom: 15px;  font-size: 20px;  color: #fff;  padding: 10px 30px;  line-height: 1.5;  font-weight: 700;  position: relative; }
.hA::before{content: ""; width: 5px; height: 57%; position: absolute; left:15px; top: 50%; transform: translateY(-50%); background: #fff; }

.btnOffice{ text-align: center; color: var(--c-orange); font-weight: 600;}
.btnOffice__btn a {display: block; border: 2px solid var(--c-orange); max-width: 220px; margin: 0 auto; color: var(--c-orange); font-size:20px; font-weight: 600; border-radius: 6px; padding: 10px 15px; position: relative; margin-bottom: 10px;}
.btnOffice__btn a::before {content: ""; width: 15px; aspect-ratio: 1/1; border-top: 2px solid var(--c-orange); border-right: 2px solid var(--c-orange); position: absolute; right: 20px; top: 50%; transform: translateY(-50%) rotate(45deg);}


/* parts */
.contBox {background: #fff;}
.contBox .inr__box {padding:0 10% 40px;}
.tel__num {padding:0; background: #fff; max-width: inherit; width: 100%; margin: 0 auto min(6vw, 30px);}
.contBox ul {font-size: 15px;}

.cont__wrap {width: 92%; margin: 0 auto;}
.cont__list {margin-bottom: 4%; padding: min(4vw,20px); background: #fff;}
.cont__title {position: relative; padding-left:60px; color:var(--c-orange);  font-size: 20px; min-height:45px; display: flex; display: -webkit-flex; align-items: center; line-height: 1.2; margin-bottom:15px; font-weight: 600;}
.cont__title::before {content: ""; width: 16px; aspect-ratio: 1/1; border-top: 2px solid var(--c-orange); border-right: 2px solid var(--c-orange); position: absolute; right: 10px; top: 50%; transform: translateY(-50%) rotate(45deg);}
.cont__title a {color:var(--c-orange);  display: block; width: 100%;}
.cont__title img {width: min(11vw,55px); display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.cont__list p { color: #333; margin: 0 0 15px; padding-top: 15px; border-top: 1px dotted var(--c-orange); }
.cont__list__wrap ul {width: 100%; margin-bottom: 0;}
.cont__list__btn li {margin: 5px 0; letter-spacing: -0.05em;}
.cont__list__btn li:last-child {margin-bottom: 0;}
.cont__list__btn li a{display: block; background: var(--c-orange); color: #fff; padding: 12px 10px 12px 25px; position: relative; transition: 0.3s all ease-in-out; font-weight: 600;}
.cont__list__btn li a::before {content: ""; width: 8px; height: 16px; background-color: #fff; clip-path: polygon(100% 50%, 0% 0%, 0% 100%); position: absolute; left: 10px; top: 0.7em;}


@media (min-width: 768px) {

/* layout */
.wrapContent {margin: min(5.83vw,70px) auto; }
.hA {margin-bottom: 30px; font-size: 24px; padding: 12px 40px; }
.tel__num {padding: min(1.66vw, 20px); background: #ffefeb; max-width: 500px; width: 80%; margin: 0 auto min(1.66vw, 20px);}

.contBox .inr__box {padding:0 min(5vw,60px) min(5vw,60px);}
.contBox ul {font-size: min(1.25vw, 1.5rem);}
.contBox .btnUnion {margin: min(2.5vw,30px) auto 0;font-weight: 400;}
.contBox .btnUnion a {margin: 0 auto; display: flex; display: -webkit-flex; justify-content: center; align-items: center; width: min(23.3vw,280px); height: min(4.67vw,56px); color: #FFF; font-size: min(2.17vw,2.6rem); background: var(--c-orange); line-height: 1; transition: 0.3s all ease-in-out;}
.contBox .btnUnion a span {position: relative; padding-left: 1em;}
.contBox .btnUnion a span::before{content: ""; position: absolute; left: -1em; top: 50%;  background: url("../img/union/arw03.png") center center / cover no-repeat; aspect-ratio: 1/1; width: min(2.92vw,35px); transform: translateY(-50%);}
.contBox .btnUnion a:hover {opacity: 0.5;}

.cont__wrap {width: 100%; margin: 0 auto; column-gap: 2%;}
.cont__list {margin-bottom: 2%; padding: min(1.66vw,20px); background: #fff;}
.cont__list p {margin-bottom:13px; line-height: 1.4; color: var(--c-orange); font-weight: 600; border-top: none; padding: 0;}
.cont__list__wrap ul {width: 30%;}

.cont__title {position: relative; padding-left: min(5.42vw,65px); color:var(--c-orange);  font-size: min(1.83vw,2.2rem); min-height: min(4.58vw,55px); display: flex; display: -webkit-flex; align-items: center; line-height: 1.2; margin-bottom: min(1.25vw, 15px); font-weight: 600;}
.cont__title::before {content: none; }
.cont__title img {width: min(4.58vw,55px); display: block; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.cont__title img {width: min(4.58vw,55px); }
.cont__list__btn li a{padding: 10px 10px 10px 25px;}
.cont__list__btn li a::before {top: 0.9em;}

.cont__list__btn li a:hover{background: var(--c-orange-dark);}

.cont--L {width: 100%;}
.cont--M {width: 66%;}
.cont--S {width: 32%;}
}


/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

dairi

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */
.bgDairi {background: var(--bg-base); padding:25px 5%; margin: 20px auto;}
.bgDairi img {width: 100%; max-width: 1000px; margin: 0 auto;}
.dairi__referance  {margin: 30px auto;}
.dairi__detail {background: #f3f3f3; border-radius: 8px; margin: 10px auto;}
.dairi__detail h2 {text-align: center; border-radius: 8px; line-height: 1.3;}
.dairi__detail h2 span {font-size: 20px;}
.dairi__detail h2::before, .dairi__detail h2::after {background: #fff; width:15px; height: 3px;}
.dairi__detail .ac-content {padding: 0 3% 20px;}
.dairi__detail .ac-content .dairi__cont {background: #fff; padding: 20px 10px; border-radius: 8px; margin: 15px auto;}
.dairi__detail .ac-content .dairi__cont:last-child {margin-bottom: 0;}
.dairi__detail .ac-content .dairi__cont a {text-decoration: underline;}

.dairi__detail .ac-content h3 {text-align: center; font-size: 18px; font-weight: 600; margin-bottom: 10px;}
.dairi__detail .ac-content h4 {padding: 15px; font-weight: 600; margin: 20px auto 10px;}
.list_brand {display: flex; display: -webkit-flex; column-gap: 5px;}
.list_brand li {flex: 1;}

.dairi--kazoku,.dairi--kazoku .ac-content h4 {background: #f6bacd; }
.dairi--kazoku h2 {background: #F6BACD; background: linear-gradient(0deg, rgba(246, 186, 205, 1) 0%, rgba(251, 221, 230, 1) 100%);}

.dairi--kyosai, .dairi--kyosai .ac-content h4 {background: #9ad1ec;}
.dairi--kyosai h2 {background: #9AD1EC; background: linear-gradient(0deg, rgba(154, 209, 236, 1) 0%, rgba(203, 232, 245, 1) 100%);}

.dairi--sitei, .dairi--sitei .ac-content h4 {background: #9ADDC0;}
.dairi--sitei h2 {background: #9ADDC0;background: linear-gradient(0deg, rgba(154, 221, 192, 1) 0%, rgba(203, 238, 223, 1) 100%);}

.dairi_outline {text-align: center; margin: 40px auto 0; font-weight: 600;}
.dairi_pdf {margin: 15px auto 0;}
.dairi_pdf li { border-bottom: 1px solid #ccc;}
.dairi_pdf li a {display: block; position: relative; padding: 12px 40px 12px 0;}
.dairi_pdf li a::before {content: ""; background: url("../img/union/dairi/union_dairi_pdf.png") center center / cover no-repeat; aspect-ratio: 24/30; width: 24px; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);}

@media (min-width: 768px) {
 .bgDairi {padding: 30px 0; text-align: center; margin: 30px 5% 40px}
 .bgDairi img {max-width: 600px;}

 .dairi__referance {display: flex; justify-content: center; column-gap: 20px; margin: 30px 0 60px !important;}
 .dairi__detail { margin: 15px auto;}
 .dairi__detail h2 {font-size: 18px; line-height: 1.4; padding: 20px 0;}
 .dairi__detail h2 span {font-size: 26px;}
 .dairi__detail h2::before, .dairi__detail h2::after {width:20px; height: 3px;}
 .dairi__detail .ac-content picture img {width: auto; max-width: 100%; margin: 0 auto; display: block;}
 .dairi__detail .ac-content {padding: 10px 5% 40px;}
 .dairi__detail .ac-content .dairi__cont { padding: 30px; margin:30px auto;}
 .dairi__detail .ac-content h3 {font-size: 24px; margin-bottom: 20px;}
 .dairi__detail .ac-content h4 {margin:30px auto 15px;}
 .dairi__detail .ac-content img {max-width: 400px;}
 .dairi_outline {margin: 60px auto 0; font-size: 18px;}
 .list_brand  {justify-content: center}
 .list_brand li {flex:inherit;}
 .list_brand li img {width: auto;}
 .dairi_pdf {display: flex; display: -webkit-flex; justify-content: space-between; flex-wrap: wrap; margin: 30px 0 60px;}
 .dairi_pdf li {width: 32%;}

 @media (max-width: 960px) {
  .dairi_pdf li {width: 100%;}
 }

}

/* ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━

about

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━ */

.union__cont article p {margin-bottom: 1em; }
.union__cont article ol {color: var(--c-orange);margin-bottom: 1em;  }
.union__cont article ol li {margin-left: 1.5em; list-style: decimal;}
.union__cont article .ttl--C {margin: 30px auto 15px;}
.union__cont article .ttl--C a {color: var(--c-orange); display: block;}
.union__cont article img {width: auto; max-width: 100%;}
.btnBack {margin: 50px auto 0; width: 260px;}
.btnBack a {display: block; background: var(--c-orange); color: #fff; text-align: center; padding: 15px 30px; border-radius: 30vw;}

.union__history article:not(:last-child) {margin-bottom: 40px;}
.union__history article h4 {font-weight: 600; font-size: 18px; border-bottom: 1px solid var(--c-orange); margin-bottom: 10px;}
.union__history article h4 a {color: var(--c-orange); display: block; padding-bottom: 10px;}
.union__history table {width: 100%; border-top:#dcdddd 1px solid;}
.union__history table th, .union__history table td {width: 100%; display: block; border:#dcdddd 1px solid;}
.union__history table th {background: #faedd4; padding: 10px; border-top: none;}
.union__history table td {padding: 10px; border-top: none;}
.union__history table td ul li {margin-left: 1.5em; list-style: disc; margin-block: 10px;}
.union__history table th a {display: block;}

@media (min-width: 768px) {
 .mainContents.union__cont {padding-top:0 !important;} 
 .union__history article h4 {font-size: 24px; margin-bottom: 20px;}
 .union__history table th, .union__history table td {width: auto; display: table-cell;}
 .union__history table th { width: 20%;}
.union__history table td {padding: 10px 20px;}

}