@charset "UTF-8";
main {
    background: #F2F2F2;
}
/* ========================================
  @media screen and (min-width: 768px), print
======================================== */
@media screen and (min-width: 768px),print {
.p-main__wrap {
    padding-block: 164px 32px;
    text-align: center;
}
.p-main__ttl {
    text-align: center;
    padding-block: 22px;
    display: inline-block;
    margin-bottom: 41px;
}
.p-main__ttl .en.conjet {margin-bottom: 14px;}
.p-main__ttl h2 {
    display: inline-block;
}

/* mv
-------------------------------------*/
.p-mv {
    background: #21242B;
    position: relative;
    top: -10px;
}
.p-mv .l-mv__inner {
    width: min(95%, 1100px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: 44.5454% 42.7272%;
    padding-block: 6px 212px;
    justify-content: space-between;
}
.p-mv .p-mv__ttl {
    font-weight: bold;
    font-size: 30px;
    letter-spacing: 0.05em;
    line-height: 1.4;
    color: #2ca6e0;
    margin-bottom: 40px;
    text-indent: 16px;
    margin-left: -16px;
}
.p-mv .p-mv__ttl span {
    margin-left: -14px;
}
.p-mv .p-mv__txt {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    color: #fff;
    letter-spacing: 0;
}

/* merit
-------------------------------------*/
.p-merit {
    width: min(95%, 1100px);
    margin-inline: auto;
    background: #fff;
    border: 1px solid #d1d1d1;
    margin-top: -100px;
    position: relative;
}
.p-merit .l-merit__inner {
    width: min(95%, 610px);
    margin-inline: auto;
    padding-block: 55px 65px;
}
.p-merit .p-merit__enttl {
    text-align: center;
    margin-bottom: 9px;
}
.p-merit .p-merit__ttl {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    text-align: center;
    margin-bottom: 28px;
}
.p-merit .p-merit__items {display: grid;gap: 24px;}
.p-merit .p-merit__item {
    font-weight: 400;
    font-size: 16px;
    line-height: 1.5;
    letter-spacing: 0;
    border-bottom: 1px dotted #ACA8A8;
    position: relative;
    padding-bottom: 25px;
    padding-left: 111px;
}
.p-merit .p-merit__item::before {
    background: #2ca6e0;
    content: "";
    height: 10px;
    left: 70px;
    position: absolute;
    top: 25%;
    transform: translateY(-50%);
    width: 10px;
}

/* about
-------------------------------------*/
.p-about {padding-block: 141px 163px;}
.p-about .p-about__items {
    display: grid;
    gap: 80px 0;
    width: min(95%, 1100px);
    margin-inline: auto;
}
.p-about .p-about__item {
    display: grid;
    grid-template-columns: 5.63636% 1fr;
    gap: 0 140px;
    padding-bottom: 77px;
    border-bottom: 1px solid #D1D1D1;
}
.p-about .p-about__num {text-align: right;padding-top: 6px;}
.p-about .p-about__ttl {
    font-weight: bold;
    font-size: 26px;
    letter-spacing: 0.05em;
    line-height: 1.5769;
    text-align: center;
    color: #fff;
    background: #1D1F24;
    padding-inline: 20px;
    padding-block: 6px;
    margin-bottom: 40px;
    display: inline-block;
}
.p-about .p-about__txt {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.5555;
    letter-spacing: 0;
}

/* recommend
-------------------------------------*/
.p-recommend .p-recommend__ttl {
    font-weight: bold;
    font-size: 30px;
    letter-spacing: 0.05em;
    line-height: 1.3666;
    text-align: center;
    color: #2ca6e0;
    margin-bottom: 70px;
}
.p-recommend .p-recommend__box {
    width: min(95%, 1020px);
    margin-inline: auto;
    margin-bottom: 40px;
}
.p-recommend .p-recommend__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 25px 40px;
    padding-bottom: 18px;
}
.p-recommend .p-recommend__item {
    font-weight: 400;
    font-size: 18px;
    line-height: 1.3333;
    letter-spacing: 0;
    padding-bottom: 25px;
    border-bottom: 1px dotted #ACA8A8;
    position: relative;
    padding-left: 110px;
}
.p-recommend .p-recommend__item::before {
    background: #2ca6e0;
    content: "";
    height: 10px;
    left: 70px;
    position: absolute;
    top: 25%;
    transform: translateY(-50%);
    width: 10px;
}
.p-recommend .p-recommend__box .etc {
    text-align: right;
    font-size: 18px;
    letter-spacing: 0;
}
.p-recommend .p-recommend__photo img {
    width: 100vw;
    max-width: 1920px;
    margin-inline: auto;
}

/* other
-------------------------------------*/
.p-other .l-other__inner {
    width: min(95%, 1100px);
    margin-inline: auto;
    padding-block: 117px;
}
.p-other .p-other__enttl {padding-left: 2px;margin-bottom: 22px;}
.p-other .p-other__ttl {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    margin-bottom: 38px;
    position: relative;
    padding-left: 26px;
}
.p-other .p-other__ttl::before {
    background: #2ca6e0;
    content: "";
    height: 10px;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
}
.p-other .p-other__items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 60px 40px;
}
.p-other .p-other__item {
    position: relative;
}
.p-other .p-other__item .img {
    margin-bottom: 24px;
}
.p-other .p-other__item .ttl {
    font-weight: 500;
    font-size: 23px;
    letter-spacing: 0;
    color: #2ca6e0;
    margin-bottom: 8px;
    padding-left: 21px;
}
.p-other .p-other__item .txt {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    padding-inline: 20px;
    margin-bottom: 22px;
}
.p-other .p-other__item .arrow {
    background: #E6E6E6;
    border-radius: 16px;
    transition: all 0.3s ease-in-out;
    width: 100px;
    height: 39px;
    place-content: center;
    display: grid;
    margin-left: auto;
    margin-right: 20px;
}
@media (any-hover: hover) {
.p-other .p-other__item:hover .arrow {
    background: #2ca6e0;
}
.p-other .p-other__item:hover .arrow svg path {
    fill: #ffffff;
}
.p-other .p-other__item:hover img {
    opacity: 1;
}
.p-other .p-other__item:hover a {
    text-decoration: none;
}
}


/* domain
-------------------------------------*/
.p-domain .l-domain__inner {
    width: min(95%, 1100px);
    margin-inline: auto;
    padding-block: 44px 180px;
}
.p-domain .p-domain__enttl {padding-left: 6px;margin-bottom: 22px;}
.p-domain .p-domain__ttl {
    font-weight: 400;
    font-size: 15px;
    line-height: 1.6;
    letter-spacing: 0;
    margin-bottom: 38px;
    position: relative;
    padding-left: 26px;
}
.p-domain .p-domain__ttl::before {
    background: #2ca6e0;
    content: "";
    height: 10px;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 10px;
}
.p-domain .p-domain__items {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 60px 10px;
}
.p-domain .p-domain__item {
    position: relative;
}
.p-domain .p-domain__item .img {
    position: relative;
}
.p-domain .p-domain__item .wrap {
    align-items: center;
    bottom: 23px;
    display: flex;
    gap: 0 12px;
    position: absolute;
    right: 29px;
}
.p-domain .p-domain__item .wrap img {
    vertical-align: middle;
}
.p-domain .p-domain__item .arrow {
    background: #ffffff;
    border-radius: 10px;
    display: grid;
    width: 60px;
    height: 25px;
    place-content: center;
    transition: all 0.3s ease-in-out;
}
.p-domain__item:last-child {
  grid-column: 1 / -1; 
} 
.p-domain__item:last-child .arrow {
    position: absolute;
    bottom: 20px;
    right: 20px;
}
@media (any-hover: hover) {
.p-domain .p-domain__item:hover .arrow {
    background: #2ca6e0;
}
.p-domain .p-domain__item:hover .arrow svg path {
    fill: #ffffff;
}
.p-domain .p-domain__item:hover img {
    opacity: 1;
}
}


}


/* ========================================
  @media screen and (min-width:768px) and (max-width:1200px)
======================================== */
@media screen and (min-width:768px) and (max-width:1200px) {
.p-mv .p-mv__ttl {
    font-size: clamp(1.5rem, 0.833rem + 1.39vw, 1.875rem);
}
.p-mv .p-mv__photo img {
    width: 100%;
    height: auto;
}
.p-about .p-about__ttl {
    font-size: clamp(1.5rem, 1.278rem + 0.46vw, 1.625rem);
}
.p-other .p-other__item .img img {
    width: 100%;
    height: auto;
}
.p-domain .p-domain__item .img img {
    width: 100%;
    height: auto;
}
}

/* ========================================
  @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
.p-main__wrap {
    padding-block: 39.9vw 0;
    text-align: center;
    display: grid;
}
.p-main__ttl {
    text-align: center;
    display: inline-block;
    order: 1;
}
.p-main__ttl .en.conjet {margin-bottom: 2.5vw;}
.p-main__ttl .en.conjet img {
    width: 35.1vw;
}
.p-main__ttl h2 {
    display: inline-block;
}
.seo_bread_list {
    z-index: 2;
    order: 2;
    position: relative;
}

/* mv
-------------------------------------*/
.p-mv {
    background: #21242B;
    position: relative;
    top: -1vw;
}
.p-mv .l-mv__inner {
    width: min(95%, 91.79vw);
    margin-inline: auto;
    display: grid;
    gap: 8.94vw;
    padding-block: 11vw 33.5vw;
}
.p-mv .p-mv__txt-box {
    order: 2;
}
.p-mv .p-mv__ttl {
    font-weight: bold;
    font-size:4.831vw;
    letter-spacing: 0.05em;
    line-height: 1.4;
    color: #2ca6e0;
    margin-bottom: 9.90vw;
    text-indent: 2.86vw;
    margin-left: 2.14vw;
}
.p-mv .p-mv__ttl span {
    margin-left: -1.38vw;
}
.p-mv .p-mv__txt {
    font-weight: 400;
    font-size:3.623vw;
    line-height: 1.6;
    color: #fff;
    letter-spacing: 0;
    width: 83.57vw;
    margin-inline: auto;
}
.p-mv .p-mv__photo {
    order: 1;
}

/* merit
-------------------------------------*/
.p-merit {
    width: min(95%, 91.79vw);
    margin-inline: auto;
    background: #fff;
    border: 0.2vw solid #d1d1d1;
    margin-top: -20.5vw;
    position: relative;
}
.p-merit .l-merit__inner {
    width: min(95%, 83.57vw);
    margin-inline: auto;
    padding-block: 12.85vw 12vw;
}
.p-merit .p-merit__enttl {
    text-align: center;
    margin-bottom: 2.17vw;
}
.p-merit .p-merit__enttl img {
    width: 21.6vw;
}
.p-merit .p-merit__ttl {
    font-weight: 400;
    font-size:3.623vw;
    line-height: 1.6;
    letter-spacing: 0;
    text-align: center;
    margin-bottom: 7.25vw;
}
.p-merit .p-merit__items {display: grid;gap: 3.08vw;}
.p-merit .p-merit__item {
    font-weight: 400;
    font-size:3.865vw;
    line-height: 1.5;
    letter-spacing: 0;
    border-bottom: 0.2vw dotted #ACA8A8;
    position: relative;
    padding-bottom: 3.38vw;
    padding-left: 9.8vw;
    padding-right: 1vw;
}
.p-merit .p-merit__item::before {
    background: #2ca6e0;
    content: "";
    height: 2.42vw;
    left: 3.2vw;
    position: absolute;
    top: 2.2vw;
    width: 2.42vw;
}

/* about
-------------------------------------*/
.p-about {padding-block: 18.84vw 20.51vw;}
.p-about .p-about__items {
    display: grid;
    gap: 12.08vw 0;
    width: min(95%, 83.57vw);
    margin-inline: auto;
}
.p-about .p-about__item {
    display: grid;
    gap: 7.93vw 0;
    padding-bottom: 11.08vw;
    border-bottom: 0.2vw solid #D1D1D1;
}
.p-about .p-about__num {
    padding-left: 3.5vw;
}
.p-about .p-about__ttl {
    font-weight: bold;
    font-size:4.831vw;
    letter-spacing: 0.05em;
    color: #fff;
    margin-bottom: 6.7vw;
    display: inline-block;
}
.p-about .p-about__ttl span {
    background: #1D1F24;
    padding-inline: 3.38vw;
    padding-block: 1.63vw;
    display: inline-block;
}
.p-about .p-about__ttl .span01 {
    margin-bottom: 1.5vw;
}
.p-about .p-about__ttl05 {
    position: relative;
    margin-bottom: 18vw;
}
.p-about .p-about__ttl05 .span02 {
    position: absolute;
    left: 0;
    top: 100%; 
    width: max-content;
    white-space: nowrap;
}
.p-about .p-about__txt {
    font-weight: 400;
    font-size:3.865vw;
    line-height: 1.75;
    letter-spacing: 0;
}

/* recommend
-------------------------------------*/
.p-recommend .p-recommend__ttl {
    font-weight: bold;
    font-size:5.797vw;
    letter-spacing: 0.05em;
    line-height: 1.708333;
    text-align: center;
    color: #2ca6e0;
    margin-bottom: 8.66vw;
}
.p-recommend .p-recommend__box {
    width: min(95%, 83.57vw);
    margin-inline: auto;
    margin-bottom: 9.26vw;
}
.p-recommend .p-recommend__items {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 4.83vw 0;
    padding-bottom: 3.03vw;
}
.p-recommend .p-recommend__item {
    font-weight: 400;
    font-size:3.623vw;
    line-height: 1.6;
    letter-spacing: 0;
    padding-bottom: 3.83vw;
    border-bottom: 0.2vw dotted #ACA8A8;
    position: relative;
    padding-left: 10.23vw;
}
.p-recommend .p-recommend__item::before {
    background: #2ca6e0;
    content: "";
    height: 2.42vw;
    left: 4.8vw;
    position: absolute;
    top: 1.4vw;
    width: 2.42vw;
}
.p-recommend .p-recommend__box .etc {
    text-align: right;
    font-size:3.623vw;
    letter-spacing: 0;
}
.p-recommend .p-recommend__photo img {
    width: 100vw;
    max-width: 1920px;
    margin-inline: auto;
}

/* other
-------------------------------------*/
.p-other .l-other__inner {
    width: min(95%, 83.57vw);
    margin-inline: auto;
    padding-block: 22.36vw;
}
.p-other .p-other__enttl {
    padding-left: 0.5vw;
    margin-bottom: 2.5vw;
}
.p-other .p-other__enttl img {
    width: 68.36vw;
}
.p-other .p-other__ttl {
    font-weight: 400;
    font-size:3.623vw;
    line-height: 1.6;
    letter-spacing: 0;
    margin-bottom: 9.66vw;
    position: relative;
    padding-left: 6.5vw;
}
.p-other .p-other__ttl::before {
    background: #2ca6e0;
    content: "";
    height: 2.42vw;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2.42vw;
}
.p-other .p-other__items {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 7.55vw 0;
}
.p-other .p-other__item {
    position: relative;
}
.p-other .p-other__item .img {
    margin-bottom: 2.4vw;
}
.p-other .p-other__item .ttl {
    font-weight: 500;
    font-size:4.348vw;
    letter-spacing: 0;
    color: #2ca6e0;
    margin-bottom: 1.9vw;
    text-align: center;
}
.p-other .p-other__item .txt {
    font-weight: 400;
    font-size:3.623vw;
    line-height: 1.6;
    letter-spacing: 0;
    margin-bottom: 5.14vw;
    width: 78.74vw;
    margin-inline: auto;
}
.p-other .p-other__item .arrow {
    background: #E6E6E6;
    border-radius: 3.86vw;
    transition: all 0.3s ease-in-out;
    width: 24.15vw;
    height: 9.66vw;
    place-content: center;
    display: grid;
    margin-left: auto;
    margin-right: 2.5vw;
}

/* domain
-------------------------------------*/
.p-domain .l-domain__inner {
    width: min(95%, 83.57vw);
    margin-inline: auto;
    padding-block: 3.6vw 16.91vw;
}
.p-domain .p-domain__enttl {
    padding-left: 1vw;
    margin-bottom: 2.5vw;
}
.p-domain .p-domain__enttl img {
    width: 39.2vw;
}
.p-domain .p-domain__ttl {
    font-weight: 400;
    font-size:3.623vw;
    line-height: 1.6;
    letter-spacing: 0;
    margin-bottom: 9.66vw;
    position: relative;
    padding-left: 6.5vw;
}
.p-domain .p-domain__ttl::before {
    background: #2ca6e0;
    content: "";
    height: 2.42vw;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 2.42vw;
}
.p-domain .p-domain__items {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 2.42vw 0;
}
.p-domain .p-domain__item {
    position: relative;
}
.p-domain .p-domain__item .img {
    position: relative;
}
.p-domain .p-domain__item .wrap {
    align-items: center;
    bottom: 3.86vw;
    display: flex;
    gap: 0 2.90vw;
    position: absolute;
    right: 3.86vw;
}
.p-domain .p-domain__item .wrap img {
    vertical-align: middle;
}
.p-domain .p-domain__item .arrow {
    background: #ffffff;
    border-radius: 2.42vw;
    display: grid;
    width: 12.80vw;
    height: 5.07vw;
    place-content: center;
    transition: all 0.3s ease-in-out;
}
.p-domain__item:last-child {margin-top: 4.5vw;} 
.p-domain__item:last-child .arrow {position: absolute;bottom: 3.26vw;right: 3.26vw;}

}