@charset "UTF-8";
body.is-fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
}
.cta_content_right_img._img01{
  background-image: url(../img/ad/cta_img01@2x.webp);
  background-size: cover;
  overflow: hidden;
  background-position: left 53%;
  background-size: min(56vw, 723px);
}
.cta_content_right_img._img02{
  background-image: url(../img/ad/cta_img02@2x.webp);
  background-size: cover;
  overflow: hidden;
  background-position: left 53%;
  background-size: min(56vw, 723px);
}
.cta_content_right_img._img04{
  background-image: url(../img/ad/cta_img04@2x.webp);
  background-size: cover;
  overflow: hidden;
  background-position: left 53%;
  background-size: min(56vw, 723px);
}
.cta_content_right_img._imgad{
  background-image: url(../img/ad/cta_img_ad@2x.webp);
  background-size: cover;
  overflow: hidden;
  background-position: left 53%;
  background-size: min(56vw, 723px);
}
.fv_content_img.page_product {
  background-image: url(../img/ad/fvimg01@2x.webp);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100vw;
  height: calc(100svh - 110px - 83vw);
}
.fv_content_title small {
  font-size: 6vw;
}
.fv_content_catch{
    letter-spacing: 1.5px;
    font-size: 6vw;
    font-weight: bold;
    margin: 15px 0 40px;
}
.value_item_title br.sp{
    display: none;
}
.slide_example_logo {
    background-repeat: repeat-x;
    background-size: auto 90px;
    width: 110vw;
    height: 90px;
    background-image: url(../img/ad/slide_logo@2x.webp);
}

@media screen and (min-width: 768px) {
    .fv_content_title small{
      font-size: 1.8rem;
    }
    .fv_content_catch{
        font-size: 2.2rem;
    }
    .fv_content_img.page_product {
        height: 100%;
        width: 100%;
    }
}

@media screen and (min-width: 1024px) {
    .fv_content_title{
        font-size: 3.5rem;
    }
    .fv_content_title small{
      font-size: 3rem;
    }
    .fv_content_catch{
        font-size: 2.7rem;
    }
    .fv_content_img.page_product {
        border-radius: 12px;
        background-image: url(../img/ad/fvimg01@2x.webp);
    }
    #value{
        padding-bottom: 0;
    }
    .page_ad #value{
        padding-bottom: 120px;
    }
}
@media screen and (min-width: 1280px) {
    .fv_content_title{
        font-size: 4.3rem;
    }
  .fv_content_title small{
      font-size: 3.8rem;
  }
  .fv_content_catch{
      font-size: 2.9rem;
  }
  .worries_anser_item_logo--silver img {
    width: 80%;
    max-width: 281px;
  }
  .cta_content_title--small{
    font-size: 3rem;
  }
}
@media screen and (min-width: 1520px) {
    .fv_content_title{
        font-size: 5.2rem;
    }
    .value_item_title {
        font-size: 2.5rem;
    }
    .fv_content_catch{
        font-size: 3.4rem;
    }
}

@media(max-width:767px){
    .fv_content_title{
        font-size:7.5vw;
    }
    .worries_list_item {
        font-size:4.2vw;
    }
    .value_item_title br.sp{
        display: block;
    }
}


/* #worries */
.worries_list_item span span {
  color: #F03219;
}


/* ======================================================
	business
========================================================= */
.fv_content_img.page_business {
  background-image: url(../img/ad/business/fvimg01@2x.webp);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100vw;
  height: calc(100svh - 110px - 83vw);
}

@media screen and (min-width: 1024px) {
    .fv_content_img.page_business {
        border-radius: 12px;
        background-image: url(../img/ad/business/fvimg01@2x.webp);
    }
}
@media screen and (min-width: 768px) {
    .fv_content_img.page_business {
        height: 100%;
        width: 100%;
    }
}


/* ======================================================
	recruit
========================================================= */
.fv_content_img.page_recruit {
  background-image: url(../img/ad/recruit/fvimg01@2x.webp);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100vw;
  height: calc(100svh - 110px - 83vw);
}

@media screen and (min-width: 1024px) {
    .fv_content_img.page_recruit {
        border-radius: 12px;
        background-image: url(../img/ad/recruit/fvimg01@2x.webp);
    }
}
@media screen and (min-width: 768px) {
    .fv_content_img.page_recruit {
        height: 100%;
        width: 100%;
    }
}


/* ======================================================
	inner
========================================================= */
.fv_content_img.page_inner {
  background-image: url(../img/ad/inner/fvimg01@2x.webp);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100vw;
  height: calc(100svh - 110px - 83vw);
}

@media screen and (min-width: 1024px) {
    .fv_content_img.page_inner {
        border-radius: 12px;
        background-image: url(../img/ad/inner/fvimg01@2x.webp);
    }
}
@media screen and (min-width: 768px) {
    .fv_content_img.page_inner {
        height: 100%;
        width: 100%;
    }
}

/* ======================================================
	corporate
========================================================= */
.fv_content_img.page_corporate {
  background-image: url(../img/ad/corporate/fvimg01@2x.webp);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100vw;
  height: calc(100svh - 110px - 83vw);
}

@media screen and (min-width: 1024px) {
    .fv_content_img.page_corporate {
        border-radius: 12px;
        background-image: url(../img/ad/corporate/fvimg01@2x.webp);
    }
}
@media screen and (min-width: 768px) {
    .fv_content_img.page_corporate {
        height: 100%;
        width: 100%;
    }
}


/* ======================================================
	ad
========================================================= */
.page_ad{
    position: relative;
}
.page_ad:before{
    content: '';
    display: block;
    width: 100%;
    height: 948px;
    background: url(../img/ad/top/visual_bg_sp.svg)no-repeat top center / cover;
    position: absolute;
    top:0;
    left: 0;
    z-index:1;
}
.page_ad #wrapper{
    position: relative;
    z-index: 2;
}
.ad_visual{
    text-align: center;
}
.ad_visual_inner{
    padding: 85px 20px 90px;
    margin: 0 auto;
}
.ad_visual_title{
    display: inline-block;
    line-height: 1.4;
    letter-spacing: 0;
    font-size: 9.5vw;
    font-weight: bold;
}
.ad_visual_title span{
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(85%, rgba(255, 255, 255, 0)), color-stop(0%, #FFE500));
    background-image: linear-gradient(rgba(255, 255, 255, 0) 85%, #FFE500 0%);
    background-position: 0px -0.1em;
}
.ad_visual_text{
    letter-spacing: 1px;
    font-size: 4vw;
    font-weight: 500;
    margin: 20px auto 63px;
}
.ad_visual_tag{
    display: inline-block;
    padding: 3px 6px 4px;
    border-radius: 50px;
    background: #F03219;
    line-height: 1;
    font-size: 3.5vw;
    font-weight: bold;
    color: #fff;
    margin-right: 3px;
}
.ad_list{
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap:40px;
    width: 660px;
    max-width: 100%;
    margin: 0 auto;
}
.ad_list li{
    width: 100%;
}
.ad_list a{
    display: block;
    padding: 10px;
    background: #FFFFFF;
    border: solid 1px #fff;
    border-radius: 10px;
    box-shadow: 12px 12px 17px rgba(122, 84, 0, 0.2);
    text-align: left;
    color: #282828;
    position: relative;
    transition: .3s;
}
.ad_list_tag{
    display: inline-block;
    padding: 3px 10px 4px;
    background: #FFE500;
    border-radius:64px 100px 100px 24px;
    line-height: 1;
    letter-spacing: 0;
    font-size: 4.26vw;
    font-weight: bold;
    color: #282828;
    position: absolute;
    top:-16px;
    left: 0;
}
.ad_list_image{
    width: 100%;
    margin-bottom: 4px;
}
.ad_list_image img{
    width: 100%;
    height: auto;
}
.ad_list_title{
    display: block;
    letter-spacing: 0;
    font-size: 5.3vw;
    font-weight: bold;
    margin-bottom: 7px;
}
.ad_list_title span{
    transition: .3s;
    color: #F03219;
}
.ad_list_text{
    line-height: 1.6;
    letter-spacing: 0;
    font-size: 3.73vw;
}
.ad_example_title{
    padding: 0 20px;
    text-align: center;
    line-height: 1.5;
    font-size: 6vw;
    font-weight: bold;
    margin: 0 auto 24px;
}
.page_ad .slide_example{
    margin-bottom: 45px;
}
.page_ad #works {
    padding-bottom: 0;
}
.page_ad #process {
    padding-bottom: 0;
}


@media(any-hover: hover){
    .ad_list a:hover{
        background: #F03219;
        color: #fff;
    }
    .ad_list a:hover .ad_list_tag{
        color: #282828;
    }
    .ad_list a:hover .ad_list_title span{
        color: #fff;
    }
}


@media screen and (min-width: 768px) {
    .page_ad:before{
        height: 1421px;
        background: url(../img/ad/top/visual_bg.svg)no-repeat top center / cover;
    }
    .ad_visual_inner{
        padding: 240px 20px 143px;
    }
    .ad_visual_title{
        font-size: 5.6rem;
    }
    .ad_visual_text{
        font-size: 2rem;
        margin: 20px auto 139px;
    }
    .ad_visual_tag{
        padding: 5px 11px 7px;
        font-size: 1.6rem;
        margin-right: 6px;
    }
    .ad_list{
        gap:50px 40px;
        width: 1194px;
    }
    .ad_list li{
        width: calc(50% - 20px);
    }
    .ad_list a{
        padding: 12px;
        border-radius: 12px;
        box-shadow: 14px 14px 20px rgba(122, 84, 0, 0.2);
    }
    .ad_list_tag{
        padding: 10px 14px;
        border-radius:64px 100px 100px 24px;
        font-size: 1.6rem;
        top:-18px;
    }
    .ad_list_image{
        margin-bottom: 12px;
    }
    .ad_list_title{
        font-size: 2.2rem;
        margin-bottom: 8px;
    }
    .ad_list_text{
        font-size: 1.6rem;
    }
    .ad_example_title{
        padding: 0;
        line-height: 1.5;
        letter-spacing: 0;
        font-size:3.6rem;
    }
    .ad_example_title .sp{
        display: none;
    }
}
@media(min-width:1000px){
    .ad_list{
        gap:50px 28px;
    }
    .ad_list li{
        width: calc((100% - 56px) / 3);
    }
    .ad_visual .sp{
        display: none;
    }
}
@media screen and (min-width: 1280px) {
    .page_ad #works {
        padding-top: 60px;
        padding-bottom: 42px;
    }
    .page_ad #voice {
        padding-bottom:0;
    }
    .page_ad #process{
        padding-top: 123px;
        padding-bottom: 20px;
    }
    .page_ad #faq{
        padding-bottom: 190px;
    }
}

/* header */
.page_ad #header {
    width: 100%;
    position: fixed;
    top:0;
    left: 0;
    z-index: 1000;
}
.page_ad .ht_head{
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 28px 12px;
}
.page_ad #ht_logo{
    position: relative;
    top:0;
    left: 0;
}
.page_ad .ht_menu_btn_box{
    position: absolute;
    top:18px;
    right: 22px;
    z-index: 1000;
}
.page_ad .ht_menu_btn{
    display: block;
    width: 76px;
    height: 40px;
    border-radius: 50px;
    background: #F03219;
    position: relative;
}
.page_ad .ht_menu_btn div{
    display: block;
    width: 25px;
    height: 2px;
    background: #fff;
    position: absolute;
    top:16px;
    left: 0;
    right: 0;
    margin: 0 auto;
    transition: .3s;
}
.page_ad .ht_menu_btn div:nth-child(2){
    top:24px;
}
.page_ad .is-open .ht_menu_btn div{
    top:18px;
    transform: rotate(30deg);
}
.page_ad .is-open .ht_menu_btn div:nth-child(2){
    top: 18px;
    transform: rotate(-30deg);
}
.page_ad #header .ht_btm {
    width: 100%;
    height: 100vh;
    height: 100lvh;
    padding: 65px 20px 100px;
    background: #fff;
    transition: .3s;
    position: fixed;
    top:0;
    right: 0;
    transform:translateX(100%);
}
.page_ad #header.is-open .ht_btm {
    transform: translateX(0);
    overflow-y: scroll;
}
.page_ad #header .ht_btm ul{
    display: flex;
    flex-wrap: wrap;
}
.page_ad #header .ht_btm ul li{
    width: 100%;
    border-bottom: solid 1px #E3E3E3;
}
.page_ad #header .ht_btm ul li:first-child{
    border-left: none;
}
.page_ad #header .ht_btm li a{
    display: block;
    padding: 16px 40px 20px 0;
    background: url(../img/ad/arrow.svg)no-repeat center right 0 / 7px;
    color: #282828;
    transition: .3s;
}
.page_ad #header .ht_btm_tag{
    display: inline-block;
    padding: 5px 8px 6px;
    background: #FFE500;
    border-radius:48px 100px 100px 12px;
    line-height: 1;
    letter-spacing: 1px;
    font-size: 1.2rem;
    font-weight: bold;
    color: #282828;
    margin-bottom: 10px;
    transition: .3s;
}
.page_ad #header .ht_btm_title{
    line-height: 1;
    letter-spacing: 2px;
    font-size: 1.5rem;
    font-weight: bold;
}
.page_ad #header .ht_btm_title span{
    font-size: 2rem;
    color: #F03219;
    transition: .3s;
}
.page_ad #header .ht_btm_title small{
    font-size: 1.5rem;
}
.page_ad #header.is-open .ht_btnarea{
    display: none;
}
.ht_btm_sp .cta_content_btnwrap{
    display: flex;
    flex-direction: column-reverse;
    width: 660px;
    gap:20px;
    max-width: 100%;
    margin: 10px auto 0;
}
.ht_btm_sp .cta_content_btn_top{
    color: #F03219;
}
.ht_btm_sp .btn_standard._border{
    background: #F03219;
}
.ht_btm_sp .btn_standard._white{
    border: solid 1px #F03219;
}
@media(any-hover: hover){
    .page_ad #header .ht_btm li a:hover{
        background: url(../img/ad/arrow--white.svg)no-repeat center right 5px / 8px;
        background-color: #F03219;
        color: #fff;
    }
    .page_ad #header .ht_btm li a:hover .ht_btm_tag{
        background: #fff;
        color: #F03219;
    }
    .page_ad #header .ht_btm li a:hover .ht_btm_title span{
        color: #fff;
    }
}
@media(min-width:768px){
    .page_ad #header {
        background: #fff;
    }
    .page_ad .ht_head{
        padding: 10px 20px 5px 36px;
        border-bottom: solid 1px #E3E3E3;
    }
    .page_ad .ht_menu_btn{
        display: none;
    }
    .page_ad #header .ht_btm {
        height: auto;
        padding: 0;
        position: relative;
        transform: translateX(0);
    }
    .page_ad #header .ht_btm ul li{
        width: 20%;
        border-left: solid 1px #E3E3E3;
    }
    .page_ad #header .ht_btm li a{
        padding: 0 12px 13px 10px;
        background: url(../img/ad/arrow.svg)no-repeat center right 5px / 8px;
    }
    .page_ad #header .ht_btm_title{
        letter-spacing: 0;
        font-size: 1.2vw;
    }   
    .page_ad #header .ht_btm_title span{
        font-size:1.3vw;
    }
    .page_ad #header .ht_btm_title small{
        font-size: 1.2vw;
    }
    .page_ad #header .ht_btm_tag{
        letter-spacing: 0;
        font-size: 1vw;
    }
    .page_ad #header .ht_btnarea{
        width: 514px;
        position: relative;
        top:0;
        right: 0;
        margin-left: auto;
        opacity: 1 !important;
    }
    .page_ad #header .ht_btn{
        width: 50%;
    }
    .page_ad #header .ht_btn a{
        width: 250px;
        max-width: 100%;
        padding: 1.5em 0px;
    }
    .page_ad #header .btn_standard{
        font-size: 1.4rem;
    }
    .page_ad .ht_btm_sp{
        display: none;
    }
}
@media(min-width:1050px){
    .page_ad #header .ht_btm_tag{
        font-size: 1.2rem;
    }
    
}
@media(min-width:1400px){
    .page_ad #header .ht_btm li a{
        padding: 0 40px 13px 24px;
        background: url(../img/ad/arrow.svg)no-repeat center right 24px / 8px;
    }
    .page_ad #header .ht_btm_title{
        font-size: 1.4rem;
    }
    .page_ad #header .ht_btm_title span{
        font-size: 2rem;
    }
    .page_ad #header .ht_btm_title small{
        font-size: 1.4rem;
    }
}