@charset "UTF-8";
/**** lity **********************/
body .lity {
 background: rgba(255, 255, 255, .8);
}

.lity-content {
 padding: 4% 3%;
 background-color: #ffffff;
}

.lity-image img {
 height: 85vh;

 -o-object-fit: contain;
    object-fit: contain;
}
@media (max-width: 769px) {
 .lity-image img {
  height: auto;
 }
}

.lity {
 -webkit-backdrop-filter: blur(3px);
         backdrop-filter: blur(3px);
}

/* ///////////////////////////// */
@font-face {
 font-weight: normal;
 font-style: normal;
 font-family: "LINE SEED";
 src: url("../font/LINESeedJP_OTF_Rg.woff") format("woff"), url("../font/LINESeedJP_OTF_Rg.woff2") format("woff2");
}
@font-face {
 font-weight: bold;
 font-style: normal;
 font-family: "LINE SEED";
 src: url("../font/LINESeedJP_OTF_Bd.woff") format("woff"), url("../font/LINESeedJP_OTF_Bd.woff2") format("woff2");
}
@font-face {
 font-weight: 900;
 font-style: normal;
 font-family: "LINE SEED";
 src: url("../font/LINESeedJP_OTF_Eb.woff") format("woff"), url("../font/LINESeedJP_OTF_Eb.woff2") format("woff2");
}
/* ///// variable ///////////////////////////////// */
:root {
 --f-font-base: "LINE SEED", sans-serif;
 /* bg */
 --bg: #ffffff;
 --bg-01: #f2f4f4;
 --bg-02: #ffffff;
 --bg-main: #ffffff;
 --bg-cont: #ffffff;
 /* color */
 --c-txt-base: #3d4347;
 --c-btn-shadow: #b8a1a19d;
 --c-01: #ff5474;
 --c-01-con: #ffffff;
 --c-02: #316ab1;
 --c-02-con: #ffffff;
 --c-03: #8da197;
 --c-03-con: #ffffff;
}

/* ///// founfation /////////////////////////////////  ****/
body {
 background-color: var(--bg);
 font-weight: 400;
 font-size: clamp(14px, 2vw, 20px);
 font-family: var(--f-font-base);
 line-height: 1.6;
}

main {
 background-color: var(--bg-main);
 background-image: linear-gradient(-45deg, var(--bg-01) 0%, var(--bg-01) 25%, var(--bg-02) 25%, var(--bg-02) 50%, var(--bg-01) 50%, var(--bg-01) 75%, var(--bg-02) 75%, var(--bg-02) 100%);
 background-size: 10px 10px;
}

main * {
 box-sizing: border-box;
 color: var(--c-txt-base);
 word-break: keep-all;
 letter-spacing: .1em;
 font-weight: inherit;
 font-size: inherit;
 font-family: inherit;
 line-height: inherit;

 overflow-wrap: break-word;
 font-feature-settings: "palt";
}

/* ///// layout /////////////////////////////////  ****/
.l_main {
 background-color: var(--bg-main);
}

.l_main ,
.l_width_main {
 position: relative;
 margin: 0 auto;
 width: min(100%, 1150px);
}

.l_width_full {
 margin: 0 calc(50% - 50vw);
 width: 100vw;
}

.l_container {
 position: relative;
 z-index: 1;
 background: var(--bg-cont);

 padding-block-start: 0;
 padding-block-end: 3.5em;
}
.l_main section:first-child .l_container {
 padding-block-start: 2.5em;
}

[class*=l_container_inner] {
 display: flex;
 align-items: center;
 flex-direction: column;
 margin: 0 auto;
 text-align: center;
}
[class*=l_container_inner] > div {
 width: 100%;
}

.l_container_inner {
 width: 88.5%;
}

.l_container_inner-l {
 width: 88.5%;
}

@media (max-width: 769px) {
 [class*=l_container_inner] {
  width: 90%;
 }
}
/* ///// component ///////////////////////////////// */
/**** text **********************/
/* text-weight */
.c_txtw-b {
 font-weight: bold;
}

.c_txtw-eb {
 font-weight: 900;
}

/* text-align */
.c_txta-c {
 text-align: center;
}

/* text-size */
.c_txts-l {
 font-size: clamp(16px, 2vw, 22px);
}

.c_txts-xl {
 font-size: clamp(18px, 2vw, 28px);
}

.c_txts-xxl {
 font-size: clamp(19px, 3vw, 42px);
}

/**** btn **********************/
.c_btn-a a {
 display: inline-block;
 position: relative;
 border-radius: 5px;
 background-color: var(--c-02);
 color: var(--c-02-con);
 text-align: center;
 font-weight: bold;
 filter: drop-shadow(0px 2px 2px var(--c-btn-shadow));
}

.c_btn-a a::before ,
.c_btn-a a::after {
 position: absolute;
 top: 0;
 right: 8%;
 bottom: 0;
 margin: auto;
 width: .2rem;
 height: .8rem;
 border: 0;
 border-radius: 10rem;
 background-color: var(--c-02-con);
 content: "";
}

.c_btn-a a:before {
 top: .4rem;
 transform: rotate(45deg);
}

.c_btn-a a:after {
 top: -.4rem;
 transform: rotate(-45deg);
}

/**** attention **********************/
[class*=c_attention] p {
 margin-top: .4em;
 margin-left: 1em;
 text-indent: -1em;
 font-size: inherit;
 line-height: 1.4;
}
[class*=c_attention] p::before {
 margin-right: .2em;
 content: "・";
}

/* ///// project ///////////////////////////////// */
.p_leadTxt {
 color: var(--c-01);
}
@media (max-width: 769px) {
 .p_leadTxt {
  letter-spacing: .05em;
 }
}

.p_leadTxt_data {
 margin-top: 1em;
}

.p_leadTxt_txt {
 margin-top: 2em;
}

.p_leadTxt_data {
 display: inline-block;
 padding: .5em 2em .3em;
 border-radius: 10vw;
 background-color: var(--c-01);
 color: var(--c-01-con);
}

.p_detail {
 display: grid;
 grid-template-columns: 30% 1fr;
 border-top: solid 1px var(--c-03);
}
@media (max-width: 769px) {
 .p_detail {
  grid-template-columns: 1fr;
  border-top: none;
 }
}
.p_detail > div {
 display: contents;
}
@media (max-width: 769px) {
 .p_detail > div {
  display: flex;
  flex-direction: column;
 }
}
.p_detail :is(dt, dd) {
 padding: 1em 0 2em;
 border-bottom: solid 1px var(--c-03);
 text-align: left;

 padding-block-start: 1em;
 padding-block-end: 2em;
}
@media (max-width: 769px) {
 .p_detail :is(dt, dd) {
  padding-inline: .5em;
 }
}
.p_detail dt {
 font-weight: bold;
}
@media (max-width: 769px) {
 .p_detail dt {
  padding-block-end: 0;
 }
 .p_detail dt h3 {
  font-size: 1.5em;
 }
}
@media (max-width: 769px) {
 .p_detail dd {
  border-bottom: none;
 }
}
.p_detail a:not(.c_btn-a a) {
 display: inline;
 background: linear-gradient(rgba(255, 255, 255, 0) 94%, var(--c-02) 0%);
 color: var(--c-02);
 font-weight: bold;
}

.p_btn_campaign {
 margin-top: 1em;
}
.p_btn_campaign a {
 padding: .7em 3em .5em 1em;
}

.c_attention {
 display: flex;
 gap: .3em;
 flex-direction: column;
}
@media (max-width: 769px) {
 .c_attention p {
  font-size: .8em;
 }
}

.p_atoneDetaul_logo {
 margin: .5em 0 1.5em;
 width: 30%;
}

/* ///// footer ///////////////////////////////// */
/* ///// responsive ///////////////////////////////// */
.sp {
 display: none;
}

.pc {
 display: block;
}

.br_pc {
 display: block;
}

@media (max-width: 769px) {
 .sp {
  display: block;
 }
 .pc {
  display: none;
 }
 .br {
  display: block;
 }
 .br_pc {
  display: none;
 }
}
/* /////////////////////////////////////////////////// */
