@charset "UTF-8";

#contentsend{ margin-top: 0; }
#common-csr{ background: none;}
@media screen and (min-width: 768px),print {
#mainttl .page-title,#mainttl .page-caption,.seo_bread_list,.seo_bread_list a{ color: #fff; }
.seo_bread_list a::after{ background: #fff;}

#mainttl{position:relative;overflow:hidden;padding: 10rem 0rem 0rem;}
#mainttl .bg-slider{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
#mainttl .swiper-slide{ background-size:cover; background-position:center; }
#mainttl .inner-Box{ position:relative; z-index:1; }
#mainttl .inner-Box .page-caption{ margin-bottom: 16.8rem; }


#contentsmain {margin: 0 auto 16.3rem 5rem;position: relative;padding: 12rem 5vw 0rem;}
#contentsmain .all-Box {margin: 0 auto;position: relative;max-width: 120rem;}
#contentsmain .all-Box h2 {margin-bottom: 5.6rem;position: relative;}
#contentsmain .all-Box p.subttl {position: relative;font-size: 1.6rem;line-height: 2.0;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 8rem;}
#contentsmain .inner-Box{position:relative;display:flex;gap:7.91%;}
#contentsmain .left-Box{position:relative;width:29%;}
#contentsmain .right-Box{position:relative;width:63%; background: url(../images/about/contents03-img02.svg)no-repeat bottom right;}

#contentsmain .left-Box figure.photo {position: relative;top: 0;left: 0;}
#contentsmain .left-Box figure.photo img{width: 100%;height: auto;}
#contentsmain .right-Box ul{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}

#contentsmain .right-Box ul li{position:relative;box-shadow: 0.4rem 0.4rem 0 #D0D7E3;transition: all 0.3s ease-in-out;border-radius: 0px 1.6rem 0px 0px;}
#contentsmain .right-Box ul li:hover{ box-shadow: 0rem 0rem 0 #D0D7E3; }
/* ここが重要 */
#contentsmain .right-Box ul li a{display:block;width:100%;height:100%;background: #fff;padding: 2rem 2.4rem 4.6rem;position: relative;transition: all 0.3s ease-in-out;top: 0;left: 0;border-radius: 0px 1.6rem 0px 0px;}
#contentsmain .right-Box ul li a:hover { top: 0.4rem; left: 0.4rem;}
#contentsmain .right-Box h3 {margin-bottom: 0.8rem;position: relative;font-size: 1.6rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: left;}
#contentsmain .right-Box p.ltext {position: relative;font-size: 1.4rem;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;color: #333;}
#contentsmain .right-Box p.f-en {position: absolute;font-size: 12px;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;bottom: 2.4rem;right: 2.4rem;padding-right: 2.2rem;}
#contentsmain .right-Box span.arr{position: absolute;/* -webkit-filter: brightness(0) invert(1); *//* filter: brightness(0) invert(1); */top: 0.1rem;right: -0.5rem;width: 2rem;border-left: 1px solid var(--main-blue);padding: 0rem 0 0rem 0.1rem;}
#contentsmain .right-Box span.arr img{transform: rotate(90deg);transform-origin: center;transition: all 0.3s ease-in-out;position: relative;left: -0.4rem;top: -0.1rem;}


#contents01 {margin: 0 auto;position: relative;background: url('../images/business/contents01-back01.jpg')no-repeat top right #fff;background-size: auto 50rem;padding: 58.1rem 5vw 16rem calc(5rem + 5vw);}
#contents02 {margin: 0 auto;position: relative;background: url('../images/business/contents02-back01.jpg')no-repeat top right ;background-size: auto 50rem;padding: 58.1rem 5vw 16rem calc(5rem + 5vw);}
#contents03 {margin: 0 auto;position: relative;background: url('../images/business/contents03-back01.jpg')no-repeat top right #fff;background-size: auto 50rem;padding: 58.1rem 5vw 16rem calc(5rem + 5vw);}
#contents04 {margin: 0 auto;position: relative;background: url('../images/business/contents04-back01.jpg')no-repeat top right ;background-size: auto 50rem;padding: 58.1rem 5vw 16rem calc(5rem + 5vw);}
#contents05 {margin: 0 auto;position: relative;background: url('../images/business/contents05-back01.jpg')no-repeat top right #fff;background-size: auto 50rem;padding: 58.1rem 5vw 16rem calc(5rem + 5vw);}

.ttl-Box {margin: 0 auto 6rem;position: relative;max-width: 120rem;text-align: center;}
.ttl-Box span.ttlicon {display: block;line-height: 1;margin-bottom: 1.6rem;}
.ttl-Box span.ttlicon img {  }
.ttl-Box h2 {color: var(--main-blue);margin-bottom: 3.2rem;position: relative;font-size: 2.8rem;line-height: 1;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
.ttl-Box p.subttl {position: relative;font-size: 1.6rem;line-height: 2.4;letter-spacing: 0.05em;font-weight: 400;text-align: center;}
.point-Box {margin: 0 auto 8rem;position: relative;background: #E7EDF7;max-width: 120rem;padding: 5.1rem 5.6rem 8rem;}
.point-Box span.point-t {display: inline-block;line-height: 1;position: relative;top: 0.5rem;}
.point-Box span.point-t img {  }
.point-Box h3 {color: var(--main-blue);font-size: 2.4rem;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;margin-bottom: 4rem;position: relative;}
.point-Box h3 span.deco { display: inline-block; }
.point-Box h3 span.deco::after{content: "";background: var(--main-blue);width: 2px;height: 3.6rem;display: inline-block;position: relative;transform: rotate(-145deg);transform-origin: center;left: 2.3rem;top: 0.8rem;}
.point-Box h3 span.deco::before{content: "";background: var(--main-blue);width: 2px;height: 3.6rem;display: inline-block;position: relative;transform: rotate(145deg);transform-origin: center;left: -2.4rem;top: 0.8rem;}
.point-Box ul{display:flex;gap:13%;margin: 0 auto;max-width: 89.3rem;}
.point-Box ul li{position:relative;width:24.66%;text-align: center;}
.point-Box figure.img {position: relative;top: 0;left: 0;margin-bottom: -3.2rem;}
.point-Box figure.img img{ width: 100%; height: auto; }
.point-Box span.not {display: block;line-height: 1;position: relative;z-index: 3;margin-bottom: 1.6rem;}
.point-Box span.not img {  }
.point-Box p.ltext {color: var(--main-blue);position: relative;font-size: 1.8rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 700;text-align: center;margin: 0 -7rem;}
.column3 {margin: 0 auto 8rem;position: relative;max-width: 120rem;}
.column3 h3.bodtl {position: relative;}
.column3 ul{display:flex;gap:2.66%;margin: 0 0 8rem;}
.column3 ul li{position:relative;width:31.5%;}
.column3 figure.photo {position: relative;top: 0;left: 0;margin-bottom: 1.6rem;}
.column3 figure.photo img{ width: 100%; height: auto; }
.column3 p.ltext {position: relative;font-size: 1.6rem;line-height: 1.8;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
.column3 p.btn {width: 100%;margin: 0 auto;}/* width: 100%に変更 */
.column3 p.btn img {width: 100%;}
.column2 {margin: 0 auto;position: relative;margin: 0 auto 8rem;position: relative;max-width: 120rem;}
.column2 ul{display:flex;gap:2%;}
.column2 ul li{width:49%;}
.column2 ul li figure img{ width: 100%; height: auto; }
.column2 ul li a {  }
.column2 ul li a:hover {  }

p.websiteb {position: relative;text-align: right;}
p.websiteb a { font-size: 1.4rem; line-height: 1.0; letter-spacing: 0.05em; font-weight: 600; text-align: right; }
p.websiteb a .arr{border-left: var(--main-blue) 1px solid;display: inline-block;padding: 0.7rem 0 0.2rem 1.5rem;margin-left: 1rem;position: relative;top: 0.2rem;}
p.websiteb a .arr img{position: relative;top: -0.3rem;}


.column2:last-child,.column3:last-child,.point-Box:last-child{ margin-bottom: 0;}

#contents02 .point-Box,#contents04 .point-Box {background: #fff;}

#contents03 .column2 ul,
#contents04 .column2 ul{gap: 4%;}
#contents04 .column2 ul li{width: 48%;}

#contents03 .column2 figure,
#contents04 .column2 figure{position:relative;top:0;left:0;margin-bottom:1.6rem;}

#contents03 .column2 figure img,
#contents04 .column2 figure img{}

#contents03 .column2 h4,
#contents04 .column2 h4{margin-bottom:1.6rem;position:relative;font-size:1.8rem;line-height:1.5;letter-spacing:0.05em;font-weight:700;text-align:left;}

#contents03 .column2 p.ltext,
#contents04 .column2 p.ltext{font-size:1.6rem;line-height:1.8;letter-spacing:0.05em;font-weight:400;text-align:left;margin-bottom:1.6rem;position:relative;}

#contents03 .column2 .subttl,
#contents04 .column2 .subttl{margin-bottom:4.8rem;font-size:1.6rem;line-height:2.4;letter-spacing:0.05em;font-weight:400;text-align:left;}

#contents05 .column4 {margin: 0 auto;position: relative;max-width: 120rem;}
#contents05 .column4 h3.bodtl {position: relative;}
#contents05 .column4 .gallery-note{margin-top:1.2rem;font-size:1.3rem;line-height:1.6;color:#666;}
#contents05 .column4 ul{ display:grid; grid-template-columns:repeat(6,1fr); gap:1.6rem; }
#contents05 .column4 ul li{ position:relative; }

#contents05 .column4 figure.photo { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; text-align: center; position: relative;}
#contents05 .column4 figure.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

​



}
@media screen and (min-width:768px) and ( max-width:1023px) {
#contentsmain{margin-left: 0rem!important;}
#contents01,#contents02,#contents03,#contents04,#contents05{ padding-left: 5vw;}


}

@media screen and (max-width: 767px) {

#mainttl .page-title,#mainttl .page-caption{color: #fff;}
.seo_bread_list{color: #999;}
.seo_bread_list a{color: #333;}
.seo_bread_list a::after{background: #333;}

#mainttl{position:relative;overflow:hidden;padding: 13.27vw 0vw 0vw;}
#mainttl .bg-slider{ position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; }
#mainttl .swiper-slide{background-size: auto 80vw;background-position: top center;}
#mainttl .inner-Box{ position:relative; z-index:1; }
#mainttl .inner-Box .page-caption{margin-bottom: 27.8vw;}
#mainttl h1{ margin-right: 1vw; }

#contentsmain {margin: 0 auto 15.47vw;position: relative;padding: 11vw 4.3vw 0vw;}
#contentsmain .all-Box {position: relative;max-width: 120rem;}
#contentsmain .all-Box h2 {margin-bottom: 6.5vw;position: relative;}
#contentsmain .all-Box p.subttl {position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;margin-bottom: 8.13vw;}
#contentsmain .inner-Box{position:relative;}
#contentsmain .left-Box{position:relative;margin: 0 5.6vw 8.4vw;}
#contentsmain .right-Box{position:relative;background: url(../images/about/contents03-img02.svg)no-repeat bottom right;background-size: 67vw auto;}

#contentsmain .left-Box figure.photo {position: relative;top: 0;left: 0;}
#contentsmain .left-Box figure.photo img{width: 100%;height: auto;}
#contentsmain .right-Box ul{display:grid;grid-template-columns:repeat(2,1fr);gap: 4.13vw 2.73vw;}

#contentsmain .right-Box ul li{position:relative;box-shadow: 1.07vw 1.07vw 0 #D0D7E3;transition: all 0.3s ease-in-out;border-radius: 0.0vw 3.73vw 0.0vw 0.0vw;}
/* ここが重要 */
#contentsmain .right-Box ul li a{display:block;width:100%;height:100%;background: #fff;padding: 4.23vw 2.9vw 9.97vw;position: relative;transition: all 0.3s ease-in-out;top: 0;left: 0;border-radius: 0.0vw 3.73vw 0.0vw 0.0vw;}
#contentsmain .right-Box h3 {color: var(--main-blue);margin-bottom: 2.13vw;position: relative;font-size: 3.73vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
#contentsmain .right-Box p.ltext {position: relative;color: #333;font-size: 3.2vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
#contentsmain .right-Box p.f-en {position: absolute;font-size: 3.2vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;bottom: 4.6vw;right: 3.4vw;padding-right: 5.87vw;color: var(--main-blue);}
#contentsmain .right-Box span.arr{position: absolute;/* -webkit-filter: brightness(0) invert(1); *//* filter: brightness(0) invert(1); */top: -0.13vw;right: -1.63vw;width: 5.33vw;border-left: 0.27vw solid var(--main-blue);padding: 0vw 0 0vw 0.27vw;}
#contentsmain .right-Box span.arr img{transform: rotate(90deg);transform-origin: center;transition: all 0.3s ease-in-out;position: relative;left: -1.07vw;top: -0.27vw;width: 2vw;}


#contents01 {position: relative;background: url('../images/business/contents01-back01.jpg')no-repeat top right #fff;background-size: auto 47.93vw;padding: 54.13vw 3.9vw 10.07vw;}
#contents02 {position: relative;background: url('../images/business/contents02-back01.jpg')no-repeat top right;background-size: auto 47.93vw;padding: 54.13vw 3.9vw 10.07vw;}
#contents03 {position: relative;background: url('../images/business/contents03-back01.jpg')no-repeat top right #fff;background-size: auto 47.93vw;padding: 54.13vw 3.9vw 10.07vw;}
#contents04 {position: relative;background: url('../images/business/contents04-back01.jpg')no-repeat top right ;background-size: auto 47.93vw;padding: 54.13vw 3.9vw 10.07vw;}
#contents05 {position: relative;background: url('../images/business/contents05-back01.jpg')no-repeat top right #fff;background-size: auto 47.93vw;padding: 54.13vw 3.9vw 10.07vw;}



.ttl-Box {margin: 0 auto 8vw;position: relative;text-align: center;}
.ttl-Box span.ttlicon {display: block;line-height: 1;margin-bottom: 2.17vw;}
.ttl-Box span.ttlicon img {width: auto;height: 10.9vw;}
.ttl-Box h2 {color: var(--main-blue);margin-bottom: 3.53vw;position: relative;font-size: 6.13vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
.ttl-Box p.subttl {position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
.point-Box {margin: 0 auto 11.93vw;position: relative;background: #E7EDF7;padding: 7.1vw 5.23vw 4.73vw;}
.point-Box span.point-t {display: inline-block;line-height: 1;position: relative;top: 1.33vw;width: 5.6vw;margin-right: -2vw;top: 0.8vw;left: -1.6vw;}
.point-Box span.point-t img {  }
.point-Box h3 {color: var(--main-blue);margin-bottom: 4.57vw;position: relative;font-size: 5.33vw;line-height: 1.8;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
.point-Box h3 span.deco { display: inline-block; }
.point-Box h3 span.deco::after{content: "";background: var(--main-blue);width: 0.43vw;height: 7.8vw;display: inline-block;position: relative;transform: rotate(-145deg);transform-origin: center;left: 4.33vw;top: 2.13vw;}
.point-Box h3 span.deco::before{content: "";background: var(--main-blue);width: 0.43vw;height: 7.8vw;display: inline-block;position: relative;transform: rotate(145deg);transform-origin: center;left: -6.40vw;top: 2.13vw;}
.point-Box ul{}
.point-Box ul li {/* width:48.71%; */display:flex;gap:5.28%;margin-bottom: 6vw;}

.point-Box ul li .photo-Box {width:29.7%;}

.point-Box ul li .text-Box {width:65%;text-align: center;}


.point-Box figure.img {position: relative;top: 0;left: 0;margin-bottom: -8.53vw;}
.point-Box figure.img img{ width: 100%; height: auto; }
.point-Box span.not {display: block;line-height: 1;position: relative;z-index: 3;margin-bottom: 2.17vw;}
.point-Box span.not img {width: auto;height: 7vw;}
.point-Box p.ltext {color: var(--main-blue);position: relative;margin: 0 -0.67vw;font-size: 4.27vw;line-height: 1.5;letter-spacing: 0.05em;font-weight: 700;text-align: center;}
.column3 {margin: 0 auto 11.93vw;position: relative;}
.column3 h3.bodtl {position: relative;padding-bottom: 5.4vw;}
.column3 ul{ margin-bottom: 7vw; }
.column3 ul li{position:relative;margin-bottom: 5.7vw;}
.column3 ul li:last-child{margin-bottom: 0;}
.column3 figure.photo {position: relative;top: 0;left: 0;margin-bottom: 2.07vw;}
.column3 figure.photo img{ width: 100%; height: auto; }
.column3 p.ltext {position: relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}
.column3 p.btn {}
.column3 p.btn img {width: 100%;}
.column2 {margin: 0 4vw;position: relative;margin: 0 auto 21.33vw;position: relative;max-width: 120rem;}
.column2 ul{}
.column2 ul li{
    margin-bottom: 4.9vw;
}
.column2 ul li figure img{ width: 100%; height: auto; }
.column2 ul li a {  }
.column2 ul li a:hover {  }

p.websiteb {position: relative;text-align: right;padding-bottom: 3vw;}
p.websiteb a {font-size: 3.13vw;line-height: 1.0;letter-spacing: 0.05em;font-weight: 600;text-align: right;}
p.websiteb a .arr{border-left: var(--main-blue) 0.27vw solid;display: inline-block;padding: 0vw 0 0vw 2.7vw;margin-left: 1.17vw;position: relative;top: -0.07vw;}
p.websiteb a .arr img{position: relative;top: 0.1vw;width: 3.9vw;left: -1vw;}


.column2:last-child,.column3:last-child,.point-Box:last-child{ margin-bottom: 0;}

#contents02 .point-Box,#contents04 .point-Box {background: #fff;}

#contents03 .column2 ul,
#contents04 .column2 ul{gap: 4%;}
#contents04 .column2 ul li{}

#contents03 .column2 figure,
#contents04 .column2 figure{position:relative;top:0;left:0;margin-bottom: 2.27vw;}

#contents03 .column2 figure img,
#contents04 .column2 figure img{}

#contents03 .column2 h4,
#contents04 .column2 h4{margin-bottom: 1.27vw;position:relative;font-size:4.80vw;line-height:1.5;letter-spacing:0.05em;font-weight:700;text-align:left;}

#contents03 .column2 p.ltext,
#contents04 .column2 p.ltext{margin-bottom: 3.17vw;position:relative;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents03 .column2 .subttl,
#contents04 .column2 .subttl{margin-bottom: 6.8vw;font-size: 3.73vw;line-height: 1.7;letter-spacing: 0.05em;font-weight: 400;text-align: left;}

#contents05 .column4 {position: relative;}
#contents05 .column4 h3.bodtl {position: relative;}
#contents05 .column4 .gallery-note{margin-top: 2.13vw;font-size: 3.2vw;line-height: 1.6;color:#666;}
#contents05 .column4 ul{display:grid;grid-template-columns: repeat(3,1fr);gap: 2.13vw;}
#contents05 .column4 ul li{ position:relative; }

#contents05 .column4 figure.photo { width: 100%; aspect-ratio: 1 / 1; overflow: hidden; text-align: center; position: relative;}
#contents05 .column4 figure.photo img { width: 100%; height: 100%; object-fit: cover; display: block; }

}