@charset "UTF-8";



/*<!--ハンバーガーメニュー-->      
 */     
      .hv_manu {
          top: 0px;
          position: fixed;
          width: 100%;
          /*height: 90px;
          background: #000000;*/
          z-index: 999;
          right: -50px;
      }
      
      #nav{
        position: absolute;
        /*height: 45vh;*/
        height:240px ;
        width: 450px;
        right:  0;
        top: 0;
        background: #05B4DA;
        transition: .7s;
        transform: translateY(-70%);
        /*clip-path: polygon(0 0, 100% 0%, 100% 20%, 58% 73%);*/
        clip-path: polygon(50% 100%, 0 0, 100% 0);

        /*max-width: 50%;*/
        
      }
      #nav {
        padding-top:0px;
      }
      #nav ul li{
        list-style-type: none;
        font-size: 20px;
        text-align: left;
      }
      #nav a{   
        display: block;
        text-decoration: none;
        color: #000000;
        margin: 0 ;/*
        padding: 15px 0 ;
        transition: .5s;
        padding-left: 60px ;*/
        position: relative;
 
      }
      

      #nav a span {

        display: block;
        font-size: 13px;
        color: #fff;
        padding-top: 6px ;
        text-decoration: underline;
    text-underline-offset: 4px;
    
      }

      #nav ul li div {
      
        position: relative;
        line-height: 1.6;
      }
      
      
      #nav ul li div ::after {
        content: '';
        display: block;
        position: absolute;
        background: url(/waga-machi-mirai/fcf_img/common/item-arrow.svg) center center no-repeat;

        background-image: none;
        width: 11px;
          height: 10px;
          transform: rotate(-90deg);
          bottom: 15px;
          right: 10%;
          background-size: contain;
      
      }
      
      #nav img {
      
      
        vertical-align: bottom ;
      }
      
      
      #top:hover{
        color: #ffffff;
        background: #cd5c5c;
       
      }
      
      #nav .bar.green a {
      
        padding-left: 60px;
      
      
      }
      li.bar ul {

        padding-left: 0;
      }

      
      li.bar li {

        padding-left: 15px;
      }

      li.bar li a  span {


        position: relative;

      }

li.bar li a span::before {

  content: '─';

}

      .bar.blue {
          background: #34B5F0;
      }
      
      .bar.blue:hover {
          background: #1496D1;
          opacity: 0.55;
      }
      .bar a {

        transition: all .55s;
      }
      .bar a:hover {
 opacity: 0.55;
     

      }
      
      .bar.pink {
          background: #E35959;
      }
      
      #nav ul .bar.pink:hover {
          background: #D84B4B;
      }
      
      
      #nav .bar.green a:hover{
        color: #ffffff;
        background: #2CA56A;
        border-bottom: none;
      }
      
      
      #hamburger {
        display: block;
        position: absolute;
        top: 12px;
        right:  200px;
        /*width: 50px;*/
        width: 54px;
        /*height: 22px;*/
        height: 30px;
        cursor: pointer;
        transition: .5s;/*
        background: #05B4DA;*/
      }
      .inner_line {
        display: block;
        position: absolute;
        left: 2px;
        width: 50px;
        height: 2px;
        background-color: #ffffff;
        transition: 1s;
        border-radius: 4px;
        margin-top: 4px;
      }
      #line1 {
        top: 0;
        height: 2px;
      }
      #line2 {
        top: 10px;
      }
      #line3 {
        /*bottom: 0px;*/
        height: 2px;
        top: 20px;
      }
      
      
      #nav.in{
        transform: translateY(0);
         /*clip-path: polygon(0 0, 100% 0%, 100% 20%, 58% 73%);*/
        clip-path: polygon(50% 100%, 0 0, 100% 0);


      }
     
      .line_1 {
        transform: translateY(10px) rotate(28deg);
        top: 0;
      }
      .line_2 {
        opacity: 0;
      }
      .line_3 {
        transform: translateY(-9px) rotate(-29deg);
        bottom: 0;
      }
      


      .in #hamburger {

        left: auto;
        right: 325px;
        transition: .5s;
      }

      .clip-shadow {

filter: drop-shadow(0px 4px 4px rgba(241, 239, 239, 0.5));

      }
      
.clip-shadow:has(.in) {

filter: drop-shadow(0px 4px 4px rgba(241, 239, 239, 0));

}

.nav_outer {
  display: grid;
  justify-content: center;


}




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

body .link_img .regular_6 a figcaption {

    margin: 25px 0 10px;

}

.on_pc03 {

    display: none !important;
}

      #nav ul li.bar li {

                padding: 5px 25px 0 15px;
                background: none;
        } 
     

#nav ul li {
          font-size: 14px;

          padding: 2px 25px 5px;
margin-bottom: 1px;

                background-color: rgb(5 180 218 / 0.8);
        }
      



        body #nav {
            opacity: 0;
            transition: 0;
            width: 100%;
            clip-path: none;
        }

body #nav.in{
     
    opacity: 1;
            clip-path: none;

                background-color: rgb(5 180 218 / 0.5);
}

     body .clip-shadow_sp { 

        background: #05B4DA;
clip-path: polygon(50% 100%, 0 0, 100% 0);

        width: 150px;
        height: 75px;
        position: absolute;
        right: -50px;
        top: -1px;
      }

.clip-shadow_sp 
#hamburger {

            right: 55px;
        top: 10px;

}

      body  #nav{ 

        transform: translateY(-150% );
                transition: none;


      }

      body .hv_manu {

        right: 0;
      }

body .in .clip-shadow_sp {
                background: none;     

}

body .nav_outer {

    margin-top: 65px;
    display: block;
}

body #nav a span {

    font-size: 1.6rem;
    text-decoration: none;
}

      }

      
/*ハンバーガーメニュー
      


      <!--//ハンバーガーメニュー-->
    <!--ヘッダー-->  
*/

      

header.dtc_header {
    position: absolute;
    background: none;
    border: 0;
    top: 0;
    display: block;

}

header.dtc_header .dtc_header-wrap {

    display: flex;
    justify-content: flex-start;
    align-items: center;
}


header.dtc_header a {
    display: flex;
        background: #0068B7;
        background-color: #0068B7;
        padding: 5px 15px 5px 5px;
        border-radius: 0 50px 50px 0;
transition: all .3s;
align-items: center;

}

body 
main .top_v {
margin-top: 0;

}

@media screen and (min-width: 999px) {

header.dtc_header a:hover {


        transform: scale(1.01);
    padding: 5px 28px 5px 6px;
    transition: all .3s;

}


}




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

header.dtc_header a {


    max-width: 50%;
}

body .main.main_font main .top_v {

    margin-top: 0 !important;
}

.text_u_box {
        background-color: #64D5EB;
        width: 300%;
        display: block;
        height: 1px;
        position: absolute;
        left: auto;
        right: auto;
        margin: 0 auto;
        transform: translateX(-50%);
        bottom: -6px;
}




      }




/*
      

<!--//ヘッダー-->  


<!--top_main-->
*/

article div {
    height: auto !important;
}


    main {
        position: relative;
    }


.main01 {
background: url(/waga-machi-mirai/img15/bg_top_deign01.png) center top no-repeat;

background-size: contain ;

aspect-ratio:1921 / 3721  ;
    position: absolute;
    
    height: auto;
    width: 100%;

        top: 21.4vw;
}

body 
.h1_tittle01 {

    display: block !important;
    position: absolute;
        top: 20vw;
            margin: 0;
    padding: 0;
}


@media screen and (min-width: 768px) {
body #dtc_top01 
.h1_tittle01 img {


    display: block;
    width: 100%;
}

body #dtc_top01 .h1_tittle01 {

        width: max(100%, 1920px);
        transform: scale(1.1);
    }

}
.top_main01 {

position: relative;
padding-top: 70px;
}
.top_main02 {

    position: relative;
padding-top: 100px;
padding-bottom: 70px;

}

.sec_main_01 {


    background-color: #3fb6d4;
    
}



.top_key_mess {
    font-size: clamp(1.8rem, -0.544rem + 3.79vw, 2.3rem);
    font-weight: bold;
    line-height: 2.3;
    color: #fff;
    padding-bottom: 25px ;
}


.h2_tit {

    position: relative;
    z-index: 1;
}

.h2_tit h2 {
    position: relative;
    display: inline;
}

.h2_under {

    background-color: #fff;
    width: 200%;
    position: absolute;
    height: 2px;
    bottom: 5px;
    right: 0;

        transform: translateX(-100%);
        transition: all .5s;


}

.trans-x0 {

            transform: translateX(0) !important;
} 



.sub_t {

margin: 50px 0;


}

.sub_t span {
     padding: 5px 15px;
    border: 1px solid #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 25px;
    font-size: 1.8rem;
    font-feature-settings: "palt";
    white-space: nowrap;

}

.link_img {

    margin-top: 50px;
}

.link_img a {

    display: block;
    overflow: hidden;
    position: relative;


}

.link_img a img {

        transition: all .3s;  
        display: block;  
}

.link_img a img:hover {

    transform: scale(1.1);

        transition: all .3s;
        opacity: .65;

}

.link_img a figure {

    position: relative;
    overflow: hidden;
}

.link_img a figcaption {

    position: absolute;
    color: #fff;

    bottom: 3.5vw;
    font-size: 2rem;
    left: 2vw;

    display: flex;
    justify-content: space-between;
}

.link_button {


    position: absolute;
    right: 2vw;
    bottom: 1vw;
    color: #fff;
    font-size: 1.4rem;
        display: flex;
    align-items: center;
    gap: 15px;
}

.link_button::after {

    content: '';
    background: url('/waga-machi-mirai/img15/link_ya.svg' )no-repeat center center ;
    width: 50px;
    height: 100px;
    background-size: 100% 100%;
display: block;
}

.link_button.link_button02 {
    position: relative;

        bottom: auto;
    right: auto;
    left: auto;
}


.link_button02:hover {

    opacity: .55;
    transition: all .3s;
}
.h3_tit {

    margin-top: 25px;
display: flex;
    justify-content: space-between;
    align-items: center;
}

.h3_tit h3 {


        font-size: 1.8rem;
    color: #fff;
    font-weight: normal;
    letter-spacing: 0.05em;
}

.mod-frame_inner {

    position: relative;
}
      @media screen and (min-width: 990px) { 

.on_mb {

    display: none !important;
}

}

      @media screen and (max-width: 767px) { 
        body #dtc_top01 .main01 {

    top:110.4vw;

        }


body  main .h1_tittle01 {
    max-width: 1920px;
    width: 250%;
    right: 0;
    margin: 0 auto;
    transform: translateX(38%);
        top: 8.5vw;
}


.mod-frame_inner {

    padding: 0 15px;
}


.moves_txt_img {
    width: 50%;
}

      }




/*
<!--sec02-->
*/


.section02 {

    margin: 100px 0 80px;
}


.section02 .sub_t span {

color: #808080;
border: 1px solid #808080;

}

.section02 .h2_under {
    background-color: #808080;

}


.section02 p {

    line-height: 1.8;

}

.flle_flb {

display: flex;
        justify-content: center;
        flex-wrap: wrap;
        
        gap: 45px 15px;
        margin: 50px 0;

}

    .file_img_inner {
        overflow: hidden;
        border-radius: 5px;
    }
    .file_img_inner img {
        display: block;

        width: 100%;
    }


        .flle_flb figcaption {
        margin-top: 5px;
    }

    .flle_flb a figcaption span {
        text-align: center;
        position: relative;
        color: #000;
        line-height: 1.2;
        display: block;
        font-size: 1.8rem;
        font-weight: bold;
            font-feature-settings: "palt";
    }


.flle_flb a {

            transition: all .3s;

}

.flle_flb a figure {

    position: relative;
}



.flle_flb a figure figcaption {

position: absolute;
bottom: 3.5vh;
background: #fff;
padding: 4px 16px 4px 6px;
display: inline-block;
}
    .flle_flb a {
        display: block;
        flex: 0 0 calc((100% - 45px) / 3);
    }
.copy_c01 {

    position: absolute;
    color: #fff;
        font-size: 80%;
    bottom: 0;
    right: 1vh;
}

    .flle_flb a:hover img {
        filter: brightness(0.5);
        transition: all .3s;
        transform: scale(1.1);
    }


.flle_flb .flile_txt {

  color: #808080;
    font-weight: bold;

}
.flle_flb .flile_txt p {


    color: #808080;
    margin-top: 25px;
}

.flle_flb .flile_txt small {
    display: block;
  margin-top: 10px;
 
    
}

.link_03,
.link_02 {

    display: flex;
    justify-content: flex-end;

}
.link_02 .link_button.link_button02{

    color: #808080;

}
.link_02 
.link_button::after {
    content: '';
    background: url(/waga-machi-mirai/img15/link_ya02.svg) no-repeat center center;
    width: 50px;
    height: 100px;
    background-size: 100% 100%;
    display: block;
}


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

    .case_t {

        max-width: 90%;
    }

.mod-frame_inner {

    padding: 0 15px;
}


}

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

    justify-content: center;
}



            .flle_flb a {
            flex: 0 0 calc((100% - 45px) / 1);
        }

}



/*

<!--sec03-->
*/

.section03 .sub_t {position: relative;}

.section03 {
    padding: 100px 0 50px;
background: url(/waga-machi-mirai/img15/bg_top_deign02.png) center top no-repeat;

background-size: cover ;

/*aspect-ratio:1921 / 3721  ;
  */  position: relative;
    
    height: auto;
    width: 100%;


background-color: #3fb6d4;
}
.section03 p {


    color: #fff;
    line-height: 1.8;

}
.section03
.flle_flb .flile_txt p {

    color: #fff;

}

.link_img.link_img03 figcaption {
position: relative;
bottom: auto;
left: auto;

margin-top: 25px;
justify-content: center;


}

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

      body .section03 {
        padding-top: 25px;
        padding-bottom:0 ;

        }

      }

/*

<!--sec04-->
*/

.section04 {

    margin: 100px 0 80px;
}

.news h3 {

    color: #808080;
    font-weight: normal;

    margin: 50px 0;
}

.news_txt {
margin-top: 25px;
    display: flex;
    gap: 5px;
}
.flle_flb .flile_txt 
.news_txt p {

    margin-top: 0;
height: 85px;

}


.news_txt figure {
 
       flex: 0 0 35px; 
}

.flle_flb .flile_txt 
.news_txt small {

display: flex;
    justify-content: space-between

}
.news_txt small span,
.news_txt small .label {

display: block;

}

.news_txt p {

  overflow: hidden;
  display: -webkit-box;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;

}

.flle_flb .news_img01 {

aspect-ratio: 650 / 360;
    overflow: hidden;

}
.flle_flb .news_img01 .file_img_inner,
.flle_flb .news_img01 img {

    border-radius: 0;
    height: 100%;

}

@media screen and (min-width: 999px) {

    
.news_flex01 a:nth-child( n + 4) {

display: none;

}

}

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

.section04 {

    padding-top: 25px;
}

.flle_flb.news_flex01 a {

flex: 0 0 calc((100% - 15px) / 2);



}

.flle_flb .flile_txt .news_txt p {

    height: auto;
    font-size: 1.2rem;
}
.news_flex01 a:nth-child( n + 5) {

display: none;

}

}

/*

<!--archive01-->
*/
.archive01 {

    background-color: #30b2d6;
    padding: 50px 0 250px;

}

.archive01 h3 {

    color: #fff;
    font-size: clamp(1.6rem, -0.275rem + 3.03vw, 2rem);
}


.archive_flb {

 display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(1, 1fr);
    gap: 25px 15px;


}

.archive01_warp {

width: 100% ;

max-width: 1140px;

margin: 50px auto ;

}

.archive_img01
.file_img_inner {

    border-radius: 0;
        width: calc(100% - 15px);
        margin: 0 auto;

}
.archive_flb a:hover img {
    filter: brightness(0.5);
    transition: all .3s;
    transform: scale(1.1);
}

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

    .archive01_warp {

margin: 25px auto !important;

    }
body .archive_flb {

 grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);

}

.archive01 {

    padding-bottom: 70px;
}
}


/*
<!--move-->
*/

.link_img.move_warp {

    margin-top: 0;
}
.move_warp .figure_inner {

    position: relative;
}


.move_s {

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50% );
    pointer-events: none;


}
main .regular_6 .slick-prev:before {
    content: '';
    background: url(/waga-machi-mirai/img15/move_l.svg) no-repeat center center;
    background-size: 100% 100%;
    display: table;
    width: 43px;
    height: 61px;
}


main .regular_6 .slick-next:before {
    content: '';
    background: url(/waga-machi-mirai/img15/move_r.svg) no-repeat center center;
    background-size: 100% 100%;
    display: table;
    width: 43px;
    height: 61px;
}

.link_img  
.regular_6 a figcaption {

    margin:25px 0;

    font-size: 2rem;
    color: #fff;
    text-align: center;
    position: relative;

    left: auto;
    display: block;
    bottom: auto;

}


.regular_6  figcaption.k_link small  {

    display: block;
    margin-top: 0;
    text-align: center;
    letter-spacing: 0.1rem;

}


.regular_6  figcaption.k_link small a {
    color: #fff;
    font-size: 1.4rem;



}


.regular_6  figcaption.k_link small a:hover {

        transform: translate(5px, 5px);
    opacity: .55;
    transition: all .3s;

}

main .regular_6 .slick-next,
main .regular_6 .slick-prev {
    top: 40%;

}


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

main .regular_6 .slick-next,
main .regular_6 .slick-prev {
    
    top: auto;
    bottom: 0;

}
body 
.regular_6 .slick-next {
    right: 20px;
}
body 
.regular_6 .slick-prev {

    left: 0;
}


body .move_s {

    max-width: 50px;
}
      }





/*
<!--character-->
*/

[class^="chara"]  {

    position: absolute;

}

[class^="chara"]  img {

    display: block;
    width: 100%;

}



.chara01 {

 
    max-width: 90px;
    top: 60%;
    left: 0;
}

.chara02 {

    right: -28.5%;
    bottom: -15vh;
    max-width: 280px;
}

.chara03 {

    right: -10vw;
    top: 0;
    max-width: 150px;
}
.chara04 {

        max-width: 150px;
    left: -15vw;
    bottom: 1.5vh;
}


.flb_chara05 {
margin-top: 35px;
    position: relative;
    display: flex;
    align-items: flex-end;
    gap: 16vw;
    left: -15vw;
}


.flb_chara05 img {

    width: 100%;

    max-width: 350px;

}

.flb_chara06 {
    display: flex;
    align-items: flex-end; 
    position: absolute;
    right: -10vw;

}
.flb_chara06 .all_chara02 {
width: 100%;
max-width: 150px;
}


.flb_chara06 .all_chara03 {
width: 100%;
max-width: 100px;
}


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


[class^="chara"]  {

    position: relative;

}

.chara01 {

    width: 20%;

}

.chara02 {

    right: auto;
    bottom: auto;
    width: 30%;
    max-width: 100px;
}

.chara03 {

    margin-left: auto;
    right: 0;
    top: 2vh;
}
.flb_chara02 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chara04 {
left: 0;
    bottom: -5vh;
    width: 20%;    
    margin-top: -65px;
    height: 100%;

}


.flb_chara05 {

    left: 0;
            bottom: -1.5vh;
}

.flb_chara06 { 

top: -22vh;
right: auto;
left: 0;
}

      }

/*

<!--footer-->

*/

footer {

    background-color: #0068B7 !important;

}

.footer_innner01 {

    padding: 50px 0 20px;

}

.foter_tit {

    display: flex;
    justify-content: center;
    align-items: center;
}

.foter_tit h2 {
    width: 50%;
    max-width: 500px;

    
}

.foter_flb {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    margin: 50px 0;
    row-gap: 25px;
}
.foter_flb div,
.foter_flb figure {

    flex: 1;
}

.foter_flb figure {

    text-align: center;
}
.footer_link01 li {
    list-style: none;
    font-size: 1.8rem;
    margin-bottom: 5px;
}

.footer_link01 li a {

    color: #fff;
}

.footer_link01 li ul {

    
    margin-top: 5px;
}
.footer_c {

    margin-top: 50px; 
    font-size: 80%;
    text-align: center;
}

.footer_link01 {
    display: flex;
    /*justify-content: center;*/
}
.footer_link01 ul:nth-child(1){


    margin-left: 50px;
}


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


    body .foter_flb {

        display: block !important;
    }
 body .footer_link01 {

       display: block;
        text-align: center;
        margin: 25px 0;
    }
body 
    .footer_link01 ul:nth-child(1) {
        margin-left: 0;

    }

.footer_link01 li.bar li {
    padding-left: 0;

}

}

/*poss*/





.main_r01 {

    /*background-image: url(/waga-machi-mirai/img15/BG_design.png) ;*/
background: url(/waga-machi-mirai/img15/BG_design.png), linear-gradient(180deg, rgba(0, 157, 207, 1) 0%, rgba(63, 182, 212, 1) 37%, rgba(63, 182, 212, 1) 75%, rgba(0, 157, 207, 1) 100%);


    width: 100%;
    background-size: 100% 100%;
    background-repeat: no-repeat;
background-position: center top;
}

.main_r01 h2 {

    font-size: 6.4rem;
    color: #fff;
    letter-spacing: 0.05em;
    line-height: 1.2;
}

.main_r01 h2 em {

    position: relative;
display: inline;
    position: relative;
    font-style: normal;
    font-weight: normal;

}
.main_r01 h2  .em02 {

padding-left:10rem;

}
.main_r01 .h2_under{

    bottom: 12px;

}
.h2_r_under {
    background-color: #fff;
    width: 1200%;
    position: absolute;
    height: 2px;
    /*bottom: 12px;*/
    left: 10rem;
    transform: translateX(100%);
    transition: all .5s;
    bottom: 0.7rem;
     }
 body     
.main_r01 
.h2_blue h2 {

    font-size: clamp(2.2rem, 0.783rem + 2.96vw, 3rem);

}

.h2_blue h2 span {
    display: block;
    margin: 15px 0;
}

.h2_blue h2 span em {

    display: inline;
    background: #0068b7;
    padding: 0 8px;
    font-weight: bold;

}




.main_r01 p {

    color: #fff;
}


.detail_img01 {

    width: 100%; 
    max-width: 930px;
    margin: 50px auto;
}

.cap_detal {

    display: flex;
    align-items: flex-start;
    gap: 25px;
}

.cap_detal figure {

    flex: 0 0 200px;
    position: relative;
}

.cap_detal figcaption {

    width: 200px;
    height: 200px;
    background: #fff;
    border-radius: 50%;
    aspect-ratio: 1 / 1;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    bottom: 100px;
    z-index: -1;
    color: #0068b7;
    font-weight: bold;

}

.cap_detal figcaption span {

padding-top: 50px;
    text-align: center;

}

.cap_detal h3  {

    color: #fff;
padding-top: 35px;
}

.cap_detal p  {

    margin-top: 25px;
}
.detail02 {

margin-top: 100px;
}


.cap_detal figcaption strong {

font-size: clamp(1.6rem, 1.246rem + 0.74vw, 1.8rem);

}
.h2_blue_warp {

background: #0068b7;
    width: 100%;
    max-width: 780px;
    padding: 25px ;


}

.label_b {

        cursor: none;
    border: 0;
    background: #0068b7;
    padding: 2px 15px;
    border-radius: 25px;
    display: flex;
    justify-content: center;
    align-items: center;
pointer-events: none;
    color: #fff;
}
.poss02
.detail02 
.cap_detal h3 {

    padding-top: 15px;
}
.poss02 
.detail02  article {

    margin-bottom: 100px;
}

.poss02_inner {

    width: 100%;
    max-width: 930px;
    margin: 0 auto;

}
.poss03
.detail02 .cap_detal h3 {

    padding-top: 0;

}

.mb100 {

    margin-bottom: 100px !important;
}


body 

[class^="coment"] li {

	font-size: 1.6rem;
}

body 
.coment ul {

color: #fff;
list-style: none;

}

body 
.coment li {
	margin-top: 8px;
	position: relative;
	padding-left: 2rem;
	margin-bottom: 5px;
	line-height: 1.4;

}


body 
.coment li::before {

	content: '※' !important;

	position: absolute !important;
	top: 0;
	left: 0;
}


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


}

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


body .detail_img01 {

    margin: 50px auto 0;

} 

body .detail_img01 figure {

line-height: 0;

}

 .poss02
    .h2_blue h2 span em {
        padding: 0;
    }

body .detail02 {

margin-top: 50px;
}

.main_r01 h2 {
    font-size: 5.4rem;
    font-feature-settings: "palt";
    display: block;
    margin-left: 15px;
}
.main_r01 h2 .em02 {
    padding-left: 0rem;

}

body .main_r01 .h2_under,
body .h2_r_under {
bottom: 1vh;

}

body .h2_r_under {
left: 0rem;
}

.cap_detal figcaption span {

font-size: 1.4rem;
        line-height: 1.2;
}

.cap_detal figcaption {


    width: 120px;
    height: 120px;
        bottom: 60px;
}

.cap_detal figure {

    flex: 0 0 120px;
}



.detail02 article {

    margin-bottom: 50px;
}

body .cap_detal p {

    display: none;
}
.detal_warp p {

    margin-top: -45px;
} 

.poss02 
.detal_warp p {

    margin-top: 10px;
} 




.main_r01 .poss02 h2 {

margin-left: 0px;
}

}

.obf {
    overflow: hidden;
    
}





/*tech*/

.tec05_sec_img {

    position: relative;
    
}
.tec05_sec_img 
.h2_blue_warp.h2_blue_warp02 {

    position: absolute;
    z-index: 1;
        top: 10%;
}


.tec05_sec_img .detail_img02 {
    position: relative;
    text-align: right;
    margin-left: auto;
    width: max(50%, 930px);
        /*max-width: 930px;*/

}


@media screen and (max-width: 989px) {
body 
.tec05_sec_img .detail_img02 {

    width: 100%;
    max-width: 930px;
}


}



.detail_img02 {

    margin: 100px 0 50px;
}
.detail_img02 img {

width: 100%;
}


.h2_blue_warp.h2_blue_warp02 {

    max-width: 550px;
}
.mod-frame_inner.mod-frame_inner02 {

    padding-right: 0;
    padding-left: 0;
}

.fl_tech01 {

    display: flex;
    align-items: center;
    position: relative;

}

.fl_tech01 .poss02_inner {

    margin-right: -25vw;
}

section[class^="tec0"],
.tec03_sec,
.tec02_sec {

    margin: 100px 0 !important;
}
#poss .h2_blue_warp 
.h2_blue h2 span {

    margin: 0 ;
}
#tech 
.main_r01 .h2_blue_warp h2 {

line-height: 1.4;
}




[class^="tec0"] p:nth-child(1),
.tec03_sec p:nth-child(1),
.tec02_sec p:nth-child(1) {

    margin-top: 50px;
}


[class^="tec0"] p, 

.tec03_sec p,
.tec02_sec p {

    margin-top: 25px;
}
#tech .em02,
#tech .h2_r_under {

    padding-left: 0;
    left: 0;

}
#tech 
.h2_blue_warp {
    padding: 35px;
    box-sizing: border-box;
}

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

    #tech 
.h2_blue_warp {
    padding: 25px;
    box-sizing: border-box;
}


}

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


    .h2_blue_warp.h2_blue_warp02 {

    max-width: 100%;
}

body 
.detail_img02 {

    margin: 100px 0 0;
    line-height: 0;
}

body .fl_tech01 {

    display: block;
}

body .fl_tech01 .poss02_inner {
position: absolute;
    width: 80%;
    top: 50%;
    transform: translateY(-50%);

}


body .fl_tech01 figure {

width: 80%;
    margin-left: auto;
}
body .fl_tech01 
.main_r01 h2 {

margin-left: 0px

}
.fl_tech01 
.h2_blue h2 span em {

    padding: 0 ;
}

body .tec05_sec_img .h2_blue_warp.h2_blue_warp02 { 

    top: -10%;
    width: 80%;

}

}




/*case-study*/
.case-study-bg {

background: linear-gradient(180deg, rgba(0, 157, 207, 1) 0%, rgba(63, 182, 212, 1) 37%, rgba(63, 182, 212, 1) 75%, rgba(0, 157, 207, 1) 100%);
}
.top_case_study {

        padding: 80px 0 40px;
}


.top_case_study p {
    color: #fff;
    line-height:1.8;
}
.top_case_study  h2 {

    font-size: 6.4rem;
    color: #fff;
    letter-spacing: 0.05em;
    line-height: 1.2;
}

.top_case_study  h2 em {

display: inline;
    position: relative;
    font-style: normal;
    font-weight: normal;
}
.top_case_study 
.h2_under {

    /*bottom: 2vh;*/
    
    bottom: 20%;
}

.case-study_h2 {
    position: relative;
}

.case-study_h2 h2 {
color: #808080;

border: 1px solid #808080;

padding: 5px 10px;
    position: relative;

    z-index: 1;
 
}

.case-study_h2_after {
  width: 216px;
  height: 142px;
  display: block;
background: #d0d0d0;
  clip-path: polygon(100% 0, 0 0, 100% 79%);
      position: absolute;
    top: 0;
    right: 0;
    z-index: 0;
    max-width: 50%;

}

.section_case01 {

    padding: 100px 0px 0px;
}

.fl_b_case.flle_flb {

    display: flex;
    gap: 50px 25px;
        margin-top: 50px;
    flex-wrap: wrap;
    justify-content: flex-start;
}

.fl_b_case a  {


    flex: 0 0 calc((100% - 25px) / 2);
}


.fl_b_case.flle_flb figcaption {

    position: relative;
    text-align: center;
    background: none;
        bottom: auto;
    display: block;
    color: #808080;
}
.fl_b_case.flle_flb figcaption small {

    display: block;
    margin-top: 10px;

}
.case-study_warp {


    background-color: #eaeaea;
    position: relative;
}
.case-study_warp main {

    background: none;
}

#case-study {

    position: relative;
    overflow: hidden;
}

.case_bg_img {

        position: absolute;
            top: -15vw;
}


.section_case02,
.section_case03 {

    margin: 80px 0;
}


.section_case03 {

    margin-bottom: 150px ;
}

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

body 
.fl_b_case a  { 

    flex: auto;

}


}



/*ex01*/


[id^="case-study_ex"]  {
    position: relative;
    overflow: hidden;

}


.ex_case_study .h2_tit {

    position: absolute;
        bottom: 5vw;
    left: 3.5vw;
    max-width: 650px;
    z-index: 1;
    width: 85%;

}

[id^="case-study_ex"] .case_bg_img {
    top: -41.85Vw;

}

.top_txt {
    font-weight: bold;
    line-height: 2.0;
}

#case-study_ex01 .coment li {

    color: #333;
}

.ex_h2 span {

background: #05b4da;
padding: 2px 10px;
display: inline-block;
font-size: clamp(1.6rem, 0.183rem + 2.96vw, 2.4rem);
margin: 5px 0;

}


.ex_h2 h2 {

    color: #fff;

}

[class*="sec_ex"] p:nth-child(1) {

    margin-top: 35px;

}

[class*="sec_ex"] p {

    margin-top: 45px;

}

.img_blue {

    margin-top: 50px;
}

.img_blue figcaption {
color: #006887;


}

.mt35 {

    margin-top: 35px !important;
}

.img_left {

    width: 80%
    
}

.img_right {

    width: 80%;
    margin-left: auto;
}

.sec_ex01_02 {

    background: #fff;
}
.section_case01.sec_ex01_02,
.section_case01.sec_ex01 {

    padding: 50px 0 50px;

}
.video01 figcaption {
    text-align: center;
    font-feature-settings: "palt";
}

.report {

    width: 100%;
    margin: 50px 0;
}


.report_h3 {

    background: #0068b7;
    padding: 0 10px;
}


.report_h3 h3 {
color: #fff;

}

.report_inner {

    background: #fff;
        border: 1px solid #0068b7;
    box-sizing: border-box;
}

.report_list {
    padding: 10px 0 15px;
}


.report_list li {
    position: relative;
    list-style: none;
    display: flex;
        margin: 10px 0px 10px 15px;
        gap: 5px;
}
.report_list li span {

    color: #0068b7;
    text-decoration: underline;
    text-decoration-color: #0068b7;
    font-weight: bold;
}
.report_list li::before {

    content: '';
    width: 0;
    height: 0;
  border-style: solid;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 12px solid #0068b7;
  border-right: 0;
    position: relative;
    top: 5px;
}

.return-top.totop a span.totop02 {
color: #0068b7;

}

.op01 {
    opacity:0 !important ;
}





/*ex02*/
    .img-tex_c {
        text-align: center;
        margin: 50px auto;
    }

    .ex_h1 {

        margin: 25px 0 35px;
    }

    .ex_h1 h2 {

        font-size: 3rem;
        color: #0068b7;
    }
    

    .sec_ex03 {
        background-color: #fff;
        max-width: 1140px;
        width: 100%;

        margin: 0 auto;

        padding: 100px 0;
        position: relative;

    }

    .sec_ex03::before {
 
        position: absolute;
    content: '';
    width: 100px;
    height: 100px;
    border-top: 3px solid #05b4da;
    border-left: 3px solid #05b4da;
    top: 0;
    left: 0;
        }

    .sec_ex03::after {
 
        position: absolute;
    content: '';
    width: 100px;
    height: 100px;
    border-bottom: 3px solid #05b4da;
    border-right: 3px solid #05b4da;
    bottom: 0;
    right: 0;
        }

    .ex_h2.h2b {

        margin-left: 0px;
    }
    .ex_h2.h2b h2 {

        color: #000;
    }
    .sec_ex01 article,
    .sec_ex03 article {

        margin-bottom: 65px;
    }


    .last_txt {
        margin-bottom: 100px;
    }


    .return-top a span {
        white-space: nowrap;
    }

    .ex_h2 {
        margin-left: -5px;
    }

    
    #case-study_ex04 .case_bg_img,
    #case-study_ex03 .case_bg_img {

    top: -41.7Vw;

    }
    #case-study_ex01 .case_bg_img {

    top: -42.05Vw;
    }

    #case-study_ex10 .case_bg_img,
    #case-study_ex08 .case_bg_img,
    #case-study_ex07 .case_bg_img,
    #case-study_ex02 .case_bg_img {

    top: -41.9Vw;

    }
#case-study .case-study_warp .file_img_inner{

    position: relative;
}

 @media screen and (max-width: 989px) {
   
    [id^="case-study_ex"] .case_bg_img {
    top: -59.5Vw;
    }


   body  #case-study_ex10 .case_bg_img,    
      body  #case-study_ex09 .case_bg_img,
      body  #case-study_ex08 .case_bg_img,
    body #case-study_ex07 .case_bg_img,
body #case-study_ex06 .case_bg_img,   
body #case-study_ex03 .case_bg_img,   
    body #case-study_ex01 .case_bg_img,
    body #case-study_ex04 .case_bg_img,
   body  #case-study_ex05 .case_bg_img {
 top: -60.5Vw;
   

   }


    
 
body #case-study_ex02 .case_bg_img {

    top: -59.9Vw;

}

}
    @media screen and (max-width: 898px) {
    [id^="case-study_ex"] .case_t {

        max-width: 100%;
    }

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


.section_case01.sec_ex01_02:has(picture) ,
 .section_case01.sec_ex01:has(picture)  {

    padding: 25px 0 0px;

}


body .ex_h2 span {

    padding: 2px 3px;
        font-feature-settings: "palt";

}

    .sec_ex03 {

        padding: 50px 0;
    }

    }


        [id^="case-study_ex"] .coment ul li {

            color: #000;
        }

        .text_u { 
            color: #000;


        }


        a .text_u:hover {
         
            opacity: .55;
            transition: all .3s;
            
        }


        
    .font_blue {

        color: #034f9e;
    }






    /*future*/

#future_top {

    overflow: hidden;

}
.future_warp {

    position: relative;
}

.future_warp main {

    background:none; 
}
body #future_top 
.flb_futu {

    row-gap: 100px;
}

body #future_top 
.flb_futu figcaption {

color: #fff;

}

.section_futu01 {

    padding: 100px 0;
}



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

.section_futu01 {

    padding: 0 0 100px;
}

body .sub_t span {

    white-space: pre-wrap;
}

}



/*future*/

.future-bg .sub_t span{

        padding: 5px 15px;
    border: 1px solid #fff;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 25px;
    font-size: clamp(1.6rem, 1.246rem + 0.74vw, 1.8rem);
    font-feature-settings: "palt";
    white-space: nowrap;
    text-shadow: 3px 1px 1px #000;;
    box-shadow: 1px 1px 2px #000;
}

.future-bg 
.h2_tit h2 {

    display: block;

}
.future-bg  
.h2_under {

bottom: 0 ;

}

.future_warp_bg.case_bg_img {

    top: -38vw;

}

.future-bg {

    background: linear-gradient(180deg, rgba(0, 157, 207, 1) 0%, rgba(63, 182, 212, 1) 37%, rgba(63, 182, 212, 1) 75%, rgba(0, 157, 207, 1) 100%);
}


.future_main{ 
overflow: hidden;
}

.future_main .h2_tit 
h2 em {
    position: relative;
    display: inline;
    position: relative;
    font-style: normal;
    font-weight: normal;
}

.h2_tit 
.futu_num {
    
    display: block;
    color: #fff;
    font-size: clamp(1.4rem, 0.337rem + 2.22vw, 2rem);
    margin: 0px 4px 18px;
    font-feature-settings: "palt";
    letter-spacing: 0.1rem;
        text-shadow: 3px 1px 3px #000;;

}

.future_main .h2_tit 
h2{
font-size: clamp(2rem, -0.48rem + 5.17vw, 3.4rem);
    color: #fff;
    letter-spacing: 0.05em;
    line-height: 1.2;
            text-shadow: 1px 1px 2px #000;;

}
.future_main p {

    color: #fff;
}
.future_main 
main 
.section_case01:nth-child(1) {


    padding: 100px 0;
}

.future_main 
main 
.section_case01:last-of-type {

    padding-bottom: 150px;

}

.future_main  
.ex_h2 span {
    background: #0068b7;

}

.future_main .ex_h2 h2 {

    font-size: clamp(2rem, 0.229rem + 3.7vw, 3rem);
}

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

body .future_warp_bg.case_bg_img {

    top: -62vw;

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

    body.future-bg .sub_t span {

    background: rgba(0, 0, 0, 0.4);

}

.future_main 
.sub_t {


    margin: 15px 0;
}
body 
.h2_tit .futu_num {

    margin: 0px 4px 9px;

}

body .future_warp_bg.case_bg_img {

    top: -62vw;

}
}


.flb_futu02 {
    display: flex;
    gap: 45px ;
    margin-top: 35px;
    justify-content: center;
}

.mt0 {

    margin-top: 0 !important;
}

/*fu03*/

.fl_b_fu03 {

    margin: 80px 0;
    display: flex;
    gap: 25px;
}
.fl_b_fu03 figure,
.fl_b_fu03 div, .fl_b_fu03 div p {

    margin-top: 0;
    flex: 1;
    padding: 0;
    margin-bottom: 25px;

}



/*special-move*/

#move01 .h2_tit em span {

    display: block;

    text-indent: 1rem;
}


.move_h2 h2 {

    display: flex;
    font-size: clamp(2rem, -0.48rem + 5.17vw, 3.4rem);

    letter-spacing: 0.05em;
    color: #fff;
    gap: 10px;
    
}

.move_h2 h2 span {

    display: block;
}

.move_h2 h2 span:nth-child(1) {

    white-space: nowrap;

}

.fl_b_end {
    display: flex;
    justify-content: flex-end;
    color: #fff;
}

.fl_trobo01,
.fl_tl01 {

    display: flex;

    gap: 20px;
    margin: 50px 0;
}

.fl_trobo01 figcaption {

    font-feature-settings: "palt";
}
[class^="fl_t"] figcaption {

text-align: center;
color: #fff;
}
#tech [class^="fl_t"] figure {

    flex:auto;
}

[class^="fl_t"] figure {

    flex:  0 0 100px;

}

.fl_tr01_inner,
.fl_tl01_inner {
position: relative;
padding: 25px;
  background-color: rgba(255,255,255,0.5);

  border-radius: 15px;
      width: max(800px, 100%);
    height: 100%;
    }

.fl_tl01_inner::before {

    content: '';
    position: absolute;
   width: 0;
  height: 0;
  border-style: solid;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
      border-left: 15px solid rgba(255, 255, 255, 0.5);
    border-right: 0;
    right: -15px;
    z-index: 0;
top:5vh;
}

.fl_tr01_inner::before {

    content: '';
    position: absolute;
   width: 0;
  height: 0;
  border-style: solid;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
      border-right: 15px solid rgba(255, 255, 255, 0.5);
    border-left: 0;
    left: -15px;
    z-index: 0;
    top:5vh;
}

#move01 
[class^="fl_t"] p {
margin: 0;
padding: 0;
color:  #0068b7 ;
font-weight: bold;
font-size: clamp(1.4rem, 0.337rem + 2.22vw, 2rem);
line-height: 1.7;
}
.link_button_a span,
.link_b01 {

    display: flex;
    justify-content: center;
    color: #fff;
}

.link_b01 small {

    text-align: center;
    display: block;
}

    .link_button_a a {

    padding: 10px 25px;
    border: 1px solid #fff;
    justify-content: center;
    align-items: center;
    color: #fff;
    border-radius: 25px;
    font-size: clamp(1.6rem, 1.246rem + 0.74vw, 1.8rem);
    font-feature-settings: "palt";
    white-space: nowrap;
    margin: 0 auto;
    display: flex;
margin: 15px;
        position: relative;
                transition: all .3s;
}


    .link_button_a  {
        transition: all .3s;        
        display: flex;
        justify-content: center;
    }
    .link_button_a a:hover {

        transition: all .3s;
transform: scale(1.1);

    }

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


.fl_tr01_inner,
.fl_tl01_inner {

    height: auto;
}

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

body 
.fl_tr01_inner,
    body 
.fl_tl01_inner {

    padding: 10px 15px;

}


}



.mod-news > li > a:after, .mod-news > li > span:after {



         background: none !important;;
    background-size: 7px auto;
    content: "";
    border-style: solid;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 10px solid rgba(255, 255, 255, 0.5);
    border-right: 0;
}


body .mod-news > li {

padding: 28px 30px 28px 10px !important;

}



/*動画ギャラリー*/

 #move_top {
    overflow: hidden;
 }   

#move_top .h2_tit {


    margin: 150px 0 0;
}

#move_top .h2_tit small {

    color: #fff;


}

.h2_under {

        transform: translateX(-100%);
        transition: all .5s;
} 

.trans-x0 {

            transform: translateX(0) !important;
} 

.move-top_h2 {

    display: flex;
    justify-content: center;
    color: #fff;


}

.move-top_h2 h2{

    font-size: clamp(2rem, -0.48rem + 5.17vw, 3.4rem);
    text-align: center;
}

.move-top_under {

        display: block;
    height: 2px ;
    width: 2%;
    background-color: #fff;
    margin: 0 auto;
    transition: all .3s;
}
.move-top_inner {

    width: 90%;
    overflow: hidden;
}

.scale01 {

    /*
    transform: scaleX(100);
       transition: all .3s;*/
        animation: fadeIn 1s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}
#move_top 
.video01 figcaption {

margin: 15px 0 10px;
    font-size: clamp(1.4rem, 0.869rem + 1.11vw, 1.7rem);
    color: #fff;
    text-align: center;
    position: relative;
    left: auto;
    display: block;
    bottom: auto;
}
#move_top  figcaption.k_link small {
    display: block;
    margin-top: 0;
    text-align: center;
    letter-spacing: 0.1rem;
    color: #fff;
    font-feature-settings: "palt";
}

#move_top 
figcaption.k_link small a {
    color: #fff;
    font-size: 1.8rem;
    display: block;
}

#move_top 
figcaption.k_link small a:hover {
    transform: translate(5px, 5px);
    opacity: .55;
    transition: all .3s;
}

@keyframes fadeIn {
  0% {
    transform: scaleX(1);
  }
  100% {
    transform: scaleX(100);
  }
}

.move_top_warp {

    margin: 80px auto;
    width: 100%;
    max-width: 645px;
    flex: 1;
}
.flle_flb 
.move_top_warp {

margin: 0 auto;

}

.flb_move_all {
    display: flex;
    gap: 50px 25px;
    flex-wrap: wrap;
    justify-content: flex-start;
margin-top: 80px;
}
.flb_move_all figure {
        flex: 0 0 calc((100% - 25px) / 2);
}

.flb_move_all .link_img {

    margin-top: 0;
}

.flb_move_all.brand figure:nth-child(even) .link_img {
    margin-top: 25%;

}
#move_top
.sub_t span {

    font-size: clamp(1.4rem, -0.371rem + 3.7vw, 2.4rem);
    padding: 5px 35px;
}
#move_top
 .sub_t {

    display: flex;
    justify-content: center;
}

.section_move_top {

    margin: 70px 0 100px;
}


main .section_move_top:last-of-type {

    padding-bottom: 100px;

}

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


body .flb_move_all {

    margin-top: 40px !important;

}

  body   
.flb_move_all figure {

    flex: auto ;
}

#move_top .h2_tit {


    margin: 80px 0;
}

.flb_move_all.brand figure:nth-child(even) .link_img {

    margin-top: 0 !important;
}
body .move_top_warp{

    margin-top: 40px;
}
}


.copy_c02 {

    text-align: right;
        margin-top: 5px;
    color: #fff;
    margin-right: 5px;
}




.poss_img_warp {
    position: relative;

    z-index: 1;

}
#poss .copy_c02 {

    margin-top: 0;
}

.copy_c02.copy_r5 {
    margin-right: 5px;
    margin-top: 2px;
}

.copy_c03 {

        position: absolute;
    right: 0;
    bottom: -1.5vh;
}

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

.poss_img_warp
    .copy_c02 {
position: absolute;
    right: 0;

    margin-top: 0;
    }

}





 .poss_img_warp02,   
.tex_img_wrap .bottom01,
.tex_img_wrap .top01 {
    position: relative;
    z-index: -1;
}
.copy_c02.copy_c04 {



    position: absolute;
right: 0;


}

.tex_img_wrap .top01 .copy_c04 {

    bottom: 0;
}

.tex_img_wrap .bottom01 .copy_c04 {

    bottom: 0;

}
.poss_img_warp .copy_b01 {

        bottom: -15px;
}

.poss_img_warp02 .copy_b02 {

    
        bottom: -18px;

}

@media screen and (max-width: 767px) 
{
body .tex_img_wrap .top01 .copy_c04 {
    top:0;
    bottom: auto;
        text-shadow: 1px 0 1px BLACK;
}



}





footer .return-top > a {

    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 900;
}


.ex_youtube img {

    width: 100%;
    display: block;
}

.ex_youtube a img:hover {

    transform: scale(1.1);

        transition: all .3s;
        opacity: .65;

}

.ex_youtube .ex_youtube_warp {

    width: 100%;
    max-width:892px ;
    margin: 0 auto;
}
.ex_youtube .ex_youtube_warp 
.figure_inner {

    position: relative;
    overflow: hidden;

}


.ex_youtube figcaption {

    margin-top: 10px;
}



/*--slikjsbutton--*/

.move_warp .js_button {
position: relative;
display: flex;
justify-content: flex-end;

}

.move_warp 
button[class^="js-"] {
    font-size: 0;
    border: 0;
    position: absolute;
    width: 15px;
    height: 15px;
    background: rgba(0,0,0,0.0);
    cursor: pointer;
    padding: 0;
    box-sizing: border-box;
    outline: none;
}


.move_warp 
button[class^="js-play"]::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    width: 0;
    height: 0;
    margin-top: -6px;
    border: 6px solid transparent;
    border-left: 10px solid #3073e1;
}

.move_warp 
button[class^="js-stop"]::before {
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    margin-top: -6px;
    border-right: 5px solid #3073e1;
    border-left: 5px solid #3073e1;
}


.move_warp .point_ev {

    opacity: 0;
    pointer-events: none;

}
 

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

body 
    .move_warp .js_button {
position: relative;
display: flex;
justify-content: center;
margin-top: 10px;
}


}

/*//--slikjsbutton--*/




    .fl_tech01 img {

        display: block;
        width: 100%;
    }

    .fl_tech01 .top01 {

        margin-bottom: 5px;
        max-width: 675px;
        margin-left: auto;

    }

        .fl_tech01 .bottom01 {
        max-width: 675px;

        margin-left: auto;

    }




    
@media screen and (max-width: 989px) { 
#dtc_top01 
.chara02.chara02_a {
 
    width: 100%;
    position: relative;
    max-width: 35%;

}
#dtc_top01 
.chara02.chara02_a img {
right: 0;
    bottom: 0;
    position: absolute;

    max-width: 100%;
    width: min(250px,100%);
}

body #dtc_top01 .chara01 {

    width: max(10%, 35px);
}
#dtc_top01 
.flb_chara02.flb_chara_a {

    align-items: flex-end;
    margin-bottom: 50px;
}
#dtc_top01 #possibilities01 .sub_t {

    margin: 0;
}
}


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

    #dtc_top01 #possibilities01 {

        padding-top: 45px;
    }


}



.jus-c {
    justify-content: center;
}

#move_top figcaption.k_link small a.mod--buttonLink {

color: #195cbf;;

}

.mod--buttonLink-large {
    font-size: 1.8rem;
    font-weight: bold;
    letter-spacing: 0.08em;
    padding: 20px 80px 20px 40px;
}
.mod--buttonLink {
    background-color: #FFFFFF;
    box-shadow: 5px 5px 15px 0px rgba(0, 114, 188, 0.2);
    color: #0072BC;
    border-radius: 35px;
    display: inline-block;
    position: relative;
    transition: all 0.3s ease;
}

.mod--buttonLink-large::before {
    background-color: #FFFFFF;
    border-radius: 50%;
    box-shadow: 2px 4px 4px 0px rgba(0, 0, 0, 0.1) inset, 2px 2px 5px 0px rgba(0, 0, 0, 0.05);
    content: "";
    display: block;
    height: 30px;
    right: 40px;
    position: absolute;
    top: 20px;
    width: 30px;
}

.mod--buttonLink::after {
    background-image: url(/asset/img/common/icon_arr_right_gradient_small.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 13px 10px;
    content: '';
    height: 14px;
    right: 44px;
    position: absolute;
    top: 29px;
    width: 20px;
}

.mod--buttonLink:hover {
    background: linear-gradient(90deg, #0072BC 0%, #0072BC 80%, #019FD6 100%);
    box-shadow: none;
    color: #FFFFFF;
    left: 5px;
    top: 3px;
}
.mod--buttonLink:hover::after{
    animation-name: modButtonLinkAnime;
    animation-fill-mode: backwards;
    animation-duration: 0.5s;
    right: 44px;
}
.k_link02 {

    margin-top: 5px;
    display: flex;
    justify-content: center;
}

.k_link02 small {

    letter-spacing: 0.1rem;
    font-feature-settings: "palt";
}

@keyframes modButtonLinkAnime{
    0%{right: 44px;}
    50%{right: 38px;}
    100%{right: 44px;}
}



.news_flex01 .news_img01 img {

    object-fit: cover;

}