/*** ----------------------------------------------------------------------------- 

reset

-----------------------------------------------------------------------------  ***/
.clearfix:after {
	content:".";
	display:block;
	visibility:hidden;
	clear:both;
	height:0.1px;
	font-size:0.1em;
	line-height:0;
}
.clearfix {
	display:inline-table;
	zoom:1;
}
/*Hides from IE-mac \*/
* html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}


/* End hide from IE-mac */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td {
	margin:0px;
	padding:0px;
}　
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset, img {
	border:0;
}
address, caption, cite, code, dfn, em, th, var {
	font-style:normal;
	font-weight:normal;
}
ul {
	list-style:none;
}
ol li{
	list-style:none;
}
caption, th {
	text-align:left;
}
h1, h2, h3, h4, h5, h6 {
	font-size:100%;
	font-weight:normal;
}
q:before, q:after {
	content:'';
}
abbr, acronym {
	border:0;
	font-variant:normal;
}
sup {
	vertical-align:top;
}
sub {
	vertical-align:text-bottom;
}
input, textarea, select {
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
}
input, textarea, select {
 *font-size:100%;
}
legend {
	color:#000000;
}
img {
	vertical-align:bottom;
    height: auto;
}
table caption {
	font-weight: bold;
	margin:0 0 5px;
}
/* iOSでのデフォルトスタイルをリセット */
input[type="submit"],
input[type="button"] {
  border-radius: 0;
  -webkit-box-sizing: content-box;
  -webkit-appearance: button;
  appearance: button;
  border: none;
  box-sizing: border-box;
  cursor: pointer;
}
input[type="submit"]::-webkit-search-decoration,
input[type="button"]::-webkit-search-decoration {
  display: none;
}
input[type="submit"]::focus,
input[type="button"]::focus {
  outline-offset: -2px;
}
/*** ------------------------------------------------------------------------------ 

HTML5

-----------------------------------------------------------------------------  ***/
#header, footer, nav, section, article, figure, aside {
	display:block;
}
* {
	box-sizing:border-box;
}
i{
	margin: 0 5px 0 0;
}
img{
	max-width: 100%;
	image-rendering: -webkit-optimize-contrast;
}

/*** ------------------------------------------------------------------------------ 

common

-----------------------------------------------------------------------------  ***/
html {
	font-size: 62.5%;
	overflow-x: hidden;
	height: 100%;
}
body {
	color: var(--color_text);
	line-height: 1.75;
	font-size: 1.6rem;
	font-family: "Noto Sans JP", Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", MS PGothic, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}
@media (max-width:768px){
	body {
		font-size: 1.6rem;
		font-family: "Noto Sans JP", sans-serif, Hiragino Kaku Gothic ProN, "ヒラギノ角ゴ Pro W3", Meiryo, "メイリオ", MS PGothic, "ＭＳ Ｐゴシック", Osaka, sans-serif;
	}	
}

.inner00{
	max-width: 1480px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner01{
	max-width: 1320px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner02{
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner03{
	max-width: 940px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
.inner04{
	max-width: 1110px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}
@media (max-width:768px){
    .inner00{
		padding: 0 10px;
	}
	.inner01{
		padding: 0 10px;
	}
	.inner02{
		padding: 0 10px;
	}
    .inner03{
		padding: 0 10px;
	}
    .inner04{
		padding: 0 10px;
    }
}

.pc{ display: block;}
.sp{ display: none;}
@media (max-width:768px){
	.pc{ display: none;}
	.sp{ display: block;}
}


/*** ----------------------------------------------------------------------------- 

変数定義

-----------------------------------------------------------------------------  ***/
:root{
    /* カラー　*/
    --color_gray: #474747;
    --color_gray01: #F0F1F2;       
    --color_gray02: #292D36;
    --color_gray03: #D9D9D9;
    --color_gray04: #C9C9C9;
    /*--color_black: #231915;*/
    --color_text: #231915;
    --color_beige: #F0F1F2;
    --color_grad-blue: linear-gradient(to right,  rgba(0,174,236,1) 14%,rgba(0,160,233,1) 48%,rgba(0,98,177,1) 100%);
    --color_grad-blue-over:  linear-gradient(to right,  rgba(0,109,187,1) 0%,rgba(0,174,236,1) 54%,rgba(0,160,233,1) 74%,rgba(0,109,187,1) 100%);
    --color_grad-blue-re: linear-gradient(to right,  rgba(0,98,177,1) 0%,rgba(0,160,233,1) 52%,rgba(0,174,236,1) 86%,rgba(0,174,236,1) 86%);
    --color_grad-blue-t: linear-gradient(to top,  rgba(0,98,177,1) 0%,rgba(0,160,233,1) 52%,rgba(0,174,236,1) 86%,rgba(0,174,236,1) 86%);
    --color_ft_grad: linear-gradient(to right,  rgba(0,174,236,1) 14%,rgba(0,160,233,1) 48%,rgba(0,130,206,1) 100%);
    
    /* フォント */
    --font_ja: "Noto Sans JP", serif;
    --font_en: "Oswald", sans-serif;
}


/*** ------------------------------------------------------------------------------ 

リンク

-----------------------------------------------------------------------------  ***/
/* 基本 */
a{
	color: var(--color_base);
	outline:none;
	-webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
}
a:link {
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a:active {
	text-decoration: none;
}
a img {
	transition: 0.3s;
}

input[type=text],
textarea {
  -webkit-appearance: none;
}





/*** ------------------------------------------------------------------------------ 

header

-----------------------------------------------------------------------------  ***/
header{
    position: fixed;
    left: 0;
    top: 0;
    z-index: 10;
    width: 100%;
}
header .header-cont{
    position: relative;
    padding: 20px 0;
/*    background: rgba(236, 239, 240, 0.2);*/
}
header .header-cont .header-logo{
    text-align: center;
}
header .header-cont  .p-btn--blue{
    position: absolute;
    right: 0;
    top: 0;
}
header .header-cont  .p-btn--blue{
    max-width: 224px;
    width: 100%;
    right: 115px;
    top: 15px;
}
header .header-cont  .p-btn--blue a{
    max-width: 224px;
    padding: 11px 10px 10px;
}
header .header-cont  .p-btn--blue a span{
    display: block;
    font-size: 1.2rem;
}
@media (max-width:900px){
    header .header-cont  .p-btn--blue{
        display: none;
    }
}
@media ( max-width:768px ){
    header .header-cont .header-logo img{
        max-width:130px;
    }
}


/*** ------------------------------------------------------------------------------ 

sp-menu-btn

-----------------------------------------------------------------------------  ***/
#sp-menu-btn{
    display: block;
    position: fixed;
    right: 25px;
    top: 15px;
    z-index:9999;
    color:#FFFFFF;
    font-size:0.76em;
    height:70px;
    overflow:hidden;
    background: #fff;
    border-radius: 50%;
}
#sp-menu-btn:before{
    content: '';
    display:block;
    position:absolute;
    left:0;
    top:37px;
    width:70px;
    text-align: center;
    font-size:1.167em;
    z-index:999;
}
#sp-menu-btn a{
    display: inline-block;
    position: relative;
    width: 70px;
    height:70px;
    overflow:hidden;
}
#sp-menu-btn a span{
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 26px;
    height: 2px;
    margin: -2px 0 0 -13px;
    background: #0062B1;
    transition: .2s;
    text-indent:-9999px;
}
#sp-menu-btn a span:before,
#sp-menu-btn a span:after{
    display: block;
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 26px;
    height: 2px;
    background: #0062B1;
    transition: .3s;
}
#sp-menu-btn a span:before{
    width: 18px;
    left: 8px;
}
#sp-menu-btn a span:after{
    width: 18px;
}
#sp-menu-btn a span:before{
    margin-top: -9px;
}
#sp-menu-btn a span:after{
    margin-top: 7px;
}
#sp-menu-btn a .close{
    background: transparent;
}
#sp-menu-btn a .close:before,
#sp-menu-btn a .close:after{
    margin-top: 0;
    background: #0062B1;
}
#sp-menu-btn a .close:before{
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    width: 26px;
    left: 0;
}
#sp-menu-btn a .close:after{
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    width: 26px;
}
@media (max-width:768px){
    #sp-menu-btn{
        right: 15px;
        top: 15px;
        height:50px;
    }
    #sp-menu-btn:before{
        width:50px;
    }
    #sp-menu-btn a{
        width: 50px;
        height:50px;
    }
}


/*** ------------------------------------------------------------------------------ 

sp-menu-bg

-----------------------------------------------------------------------------  ***/
.sp-menu-bg{
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    width: 100%;
    height: 100vh;
    background: #292D36;
    visibility: hidden;
    opacity: 0;
    transition: 0.2s;
}
.sp-menu-bg.is_active{
    visibility: visible;
    opacity: 1;
}
.sp-menu-bg::before{
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    width: 50%;
    height: 100vh;
    background: url("../img/sp-menu-bg.jpg?ver=250527") no-repeat center center / cover;
}
@media (max-width:768px){
    .sp-menu-bg{
        display: none;
    }
}


/*** ------------------------------------------------------------------------------ 

sp-menu

-----------------------------------------------------------------------------  ***/
.sp-menu{
    display: block;
    position: fixed;
    right: -200%;
    top: 0;
    z-index: 1000;
    width: 50%;
    height: 100%;
    background: #F7FAFC;
    transition: 0.3s;
}
.sp-menu.is_active{
    right: 0%;
}
.sp-menu nav{
    overflow-y: scroll;
    height: 100vh;
    background: url("../img/sp-menu-bg-txt.svg") no-repeat right bottom, #292D36;
    display: flex;
    align-items: center;
    padding: 0 5% 0 12.5%;
    box-sizing: border-box;
}
.sp-menu nav::-webkit-scrollbar{
    display:none;
}
.sp-menu nav .sp-nav-cont{
    width: 100%;
}
.sp-menu nav ul li{
    margin: 0 0 1.0em;   
}
.sp-menu nav ul li a{
    font-size: 1.4rem;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    position: relative;
}
.sp-menu nav ul li a::after{
    position: absolute;
    left: 0;
    bottom: -6px;
    content: '';
    width: 0;
    height: 1px;
    background: var(--color_grad-blue);
    transition: 0.3s;
}
@media (min-width:769px){
    .sp-menu nav ul li a:hover::after{
        width: 100%;
    }
}
.sp-menu nav ul li a .en{
    display: inline-block;
    font-family: var(--font_en);
    font-size: 3.2rem;
    font-weight: 600;
    background: var(--color_grad-blue);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin: 0 20px 0 0;
}
.sp-menu nav ul li a .ja{
    display: inline-block;
    transform: translateY(-25%);
}
.sp-menu nav .p-btn--blue{
    margin: 50px 0 0;
}
.sp-menu nav .p-btn--blue a{
    padding: 15px 10px;
    font-size: 1.8rem;
}
.sp-menu nav .p-btn--blue a span{
    display: block;
    font-size: 1.2rem;
}
@media (max-width:768px){
    .sp-menu{
        width: 100%;
    }
    .sp-menu nav{
        padding: 0 5% 0 5%;
        box-sizing: border-box;
        background: url("../img/sp-menu-bg-txt.svg") no-repeat right top 120px / 87px auto, #292D36;
    }
    .sp-menu nav ul li a{
        font-size: min(1.6rem, 3.0vw);
        font-weight: 500;
    }
    .sp-menu nav ul li a .ja{
        transform: translateY(-20%);
    }
    .sp-menu nav ul li a .en{
        font-size: min(2.8rem, 5.5vw);
        margin: 0 15px 0 0;
    }
    .sp-menu nav .p-btn--blue{
        max-width: 315px;
        width: 100%;
        margin: 50px auto 0;
    }
    .sp-menu nav .p-btn--blue a{
        max-width: 315px;
        margin: 0 auto;
    }
}


/*** ------------------------------------------------------------------------------ 

footer

-----------------------------------------------------------------------------  ***/
footer{
    background: var(--color_gray02);
    padding: 0 0 50px;
}
footer .footer-cont01{
    background: url("../img/ft-bg.svg") no-repeat center top;
    max-width: 1220px;
    margin: 0 auto;
    padding: 20px 20px 0;
    box-sizing: border-box;
    position: relative;
}
footer .footer-cont01 .topic-pass{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
footer .footer-cont01 .topic-pass li{
    font-size: 1.2rem;
    font-weight: 500;
    color: #fff;
}
footer .footer-cont01 .topic-pass li::after{
    content: '';
    display: inline-block;
    margin: 0 12px;
    width: 6px;
    height: 12px;
    background: url("../img/icon-arrow-white.svg") no-repeat center center / 100% auto;
}
footer .footer-cont01 .topic-pass li:last-child::after{
    content: none;
}
footer .footer-cont01 .footer-logo{
    margin: 0 0 5.0em;
    padding: 285px 0 0;
}
footer .footer-cont01 .flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 0 0 45px;
}
footer .footer-cont01 .flex ul{
    display: flex;
    flex-wrap: wrap;
    max-width: 400px;
    margin: 0;
}
footer .footer-cont01 .flex ul li{
    margin: 0 10px 15px
}
footer .footer-cont01 .flex ul li a{
    letter-spacing: 0.05vw;
    color: #fff;
    text-decoration: none;
    position: relative;
}
footer .footer-cont01 .flex ul li a::after{
    position: absolute;
    left: 0;
    bottom: -5px;
    content: '';
    width: 100%;
    height: 2px;
    background: #fff;
    transition: 0.3s;
    transform: scale(0);
    border-radius: 2px;
}
@media (min-width:769px){
    footer .footer-cont01 .flex ul li a:hover::after{
        transform: scale(1);
    }   
}
footer .footer-cont01 .flex .p-btn--blue{
    max-width: 332px;
    width: 100%;
    display: block;
    letter-spacing: 0.05vw;
}
footer .footer-cont01 .flex .p-btn--blue a {
    padding: 13px 10px;
}
footer .footer-cont01 .flex .p-btn--blue a span{
    display: block;
    font-size: 1.2rem;
}

footer .footer-cont02{
    max-width: 1320px;
    margin: 0 auto;
    padding: 100px 20px 0;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
footer .footer-cont02 ul{
    display: flex;
    flex-wrap: wrap;
    padding: 0 0 0 15px;
}
footer .footer-cont02 ul li{
    margin: 0 40px 0 0;
}
footer .footer-cont02 ul li a{
    font-size: 1.474rem;
    color: #fff;
    text-decoration: none;
    position: relative;
}
footer .footer-cont02 ul li a::after{
    position: absolute;
    left: 0;
    bottom: -5px;
    content: '';
    width: 100%;
    height: 2px;
    background: #fff;
    transition: 0.3s;
    transform: scale(0);
    border-radius: 2px;
}
@media (min-width:769px){
    footer .footer-cont02 ul li a:hover::after{
        transform: scale(1);
    }   
}
footer .footer-cont02 .copyright{
    text-align: right;
    font-family: var(--font_en);
    font-size: 1.474rem;
    line-height: 1.5;
    color: #fff;
}
@media (max-width:850px){
    footer .footer-cont01 .flex{
        padding: 0;
    }
    footer .footer-cont02 ul{
        padding: 0;
    }
}
@media (max-width:768px){
    footer{
        background: var(--color_gray02);
        padding: 0 0 55px;
    }
    footer .footer-cont01{
        background: url("../img/ft-bg.svg") no-repeat center top / 375px auto;
        padding: 10px 20px 0;
    }
    footer .footer-cont01 .flex{
        display: block;
        padding: 0 5px;
    }
    footer .footer-cont01 .footer-logo{
        max-width: 256px;
        margin: 0 0 35px;
        padding: 80px 0 0;
    }
    footer .footer-cont01 .flex ul{
        display: block;
        margin: 0 0 50px;
    }
    footer .footer-cont01 .flex ul li{
        margin: 0 0 15px;
    }
    footer .footer-cont01 .flex .p-btn--blue{
        max-width: 286px;
        margin: 0 auto;
    }
    footer .footer-cont02{
        display: block;
        padding: 50px 25px 0;
    }
    footer .footer-cont02 ul{
        display: block;
    }
    footer .footer-cont02 .copyright{
        text-align: center;
        margin: 76px 0 0;
    }
}



/*** ------------------------------------------------------------------------------ 

scroll-top

-----------------------------------------------------------------------------  ***/
.scroll-top{
    position: fixed;
    right: 25px;
    bottom: 55px;
    z-index: 10;
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}
.scroll-top.on{
    opacity: 1;
    visibility: visible;
}
@media (max-width:768px){
    .scroll-top{
        width: 60px;
        right: 15px;
        bottom: 20px;
    }   
}

/*** ------------------------------------------------------------------------------ 

main

-----------------------------------------------------------------------------  ***/
main{
    padding: 100px 0 0;
    position: relative;
}
main::after{
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    content: '';
    width: 100%;
    height: 150px;
    background: #ECEFF0;
}
@media (max-width:768px){
    main{
        padding: 80px 0 0;
    }
}


/*** ------------------------------------------------------------------------------ 

headline01

-----------------------------------------------------------------------------  ***/
.headline{
    margin: 0 0 60px;
}
.headline .headline__title{
    text-align: center;
}
.headline .headline__title{
    text-align: center;
    font-size: 1.8rem;
    font-weight: bold;
    margin: 0 0 25px;
}
.headline .headline__title .text-grad--blue{
    display: inline-block;
    background: var(--color_grad-blue);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.headline .headline__en{
    text-align: center;
    font-family: var(--font_en);
    font-size: 8.0rem;
    font-weight: 500;
    color: var(--color_text);
    line-height: 1.0;
}
@media (max-width:768px){
    .headline .headline__title{
        font-size: 1.6rem;
        margin: 0 0 10px;
    }
    .headline .headline__en{
        font-size: 4.5rem;
    }
    #home .section-company .section-company__text{
        padding: 0 15px;
        font-size: 1.4rem;
        font-weight: bold;
        line-height: 1.8;
    }
}



/*** ------------------------------------------------------------------------------ 

visual-page

-----------------------------------------------------------------------------  ***/
.visual-page{
    padding: 50px 25px;
}
.visual-page .visual-page__title{
    text-align: center;
    font-size: 1.8rem;
    font-weight: 500;
    line-height: 1.0;
    color: #01A1E6;
    margin: 0 0 1.25em;
}
.visual-page .visual-page__en{
    text-align: center;
    font-family: var(--font_en);
    font-size: 8.0rem;
    font-weight: 500;
    line-height: 1.0;
    color: var(--color_text);
}
@media (max-width:768px){
    .visual-page{
        padding: 45px 20px;
    }
    .visual-page .visual-page__title{
        font-size: 1.6rem;
        margin: 0 0 1.0em;
    }
    .visual-page .visual-page__en{
        font-size: 4.5rem;
        font-weight: 600;
        color: var(--color_text);
    }
}



/*** ------------------------------------------------------------------------------ 

topic-pass

-----------------------------------------------------------------------------  ***/
.topic-pass ul{
    display: flex;
    justify-content: flex-end;
    margin: 0 0 0 auto;
}
.topic-pass ul li{
    margin: 10px 0;
    font-size: 1.2rem;
}
.topic-pass ul li:nth-child(3){
    max-width: 400px;
    white-space: nowrap; /* 折り返し無しにする */
    overflow: hidden; /* はみ出た部分を非表示 */
    text-overflow: ellipsis; /* 語尾を3点リーダーに */
}
.topic-pass ul li a{
    line-height: 1.0;
}
.topic-pass ul li::after{
    content: '>';
    margin: 0 5px;
}
.topic-pass ul li:last-child::after{
    content: none;
}
@media (max-width: 1240px){
    .topic-pass ul li:nth-child(3){
        max-width: 300px;
    }
}
@media (max-width: 1100px){
    .topic-pass ul li:nth-child(3){
        max-width: 200px;
    }
}
@media (max-width: 1000px){
    .topic-pass ul li:nth-child(3){
        max-width: 100px;
    }
}
@media (max-width: 768px){
    .topic-pass ul{
        justify-content: flex-start;
        flex-wrap: wrap;
        margin: 5px auto 0;
    }
    .topic-pass ul li{
        margin: 5px 0;
    }
    .topic-pass ul li:nth-child(3){
        max-width: 300px;
    }
}




/*** ------------------------------------------------------------------------------ 

p-btn--blue

-----------------------------------------------------------------------------  ***/
.p-btn--blue{
    
}
.p-btn--blue a{
    display: block;
    max-width: 393px;
    width: 100%;
    padding: 21px 10px;
    box-sizing: border-box;
    border-radius: 45px;
    font-size: 1.6rem;
    font-weight: bold;
    color: #fff;
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    transition: 0.3s;
}
.p-btn--blue a::before{
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    z-index: -1;
    width: 100%;
    height: 100%;
    background: var(--color_grad-blue);
    border-radius: 45px;
    transition: 0.3s;
}
.p-btn--blue a::after{
    position: absolute;
    left: 0;
    top: 0;
    content: '';
    z-index: -2;
    width: 100%;
    height: 100%;
    background: var(--color_grad-blue-over);
    border-radius: 45px;
}
@media (min-width:769px){
    .p-btn--blue a:hover{
        transform: scale(1.03);
    }
    .p-btn--blue a:hover::before{
        opacity: 0;
    }   
}
@media (max-width:768px){
    .p-btn--blue a{
        max-width: 280px;
    }
}

/*** ------------------------------------------------------------------------------ 

p-btn-white

-----------------------------------------------------------------------------  ***/
.p-btn--white{
    
}
.p-btn--white a{
    display: block;
    max-width: 389px;
    width: 100%;
    padding: 21px 10px;
    box-sizing: border-box;
    border-radius: 45px;
    font-size: 1.6rem;
    font-weight: bold;
    color: var(--color_text);
    text-align: center;
    text-decoration: none;
    position: relative;
    z-index: 1;
    transition: 0.3s;
}
.p-btn--white a::before{
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    content: '';
    width: 100%;
    height: 100%;
    background: #fff;
    border-radius: 45px;
    transition: 0.3s;
}
.p-btn--white a::after{
    position: absolute;
    left: -2px;
    top: -2px;
    z-index: -2;
    content: '';
    width: calc(100% + 4px);
    height: calc(100% + 4px);
    background: var(--color_grad-blue);
    border-radius: 45px;
}
@media (min-width:769px){
    .p-btn--white a:hover{
        transform: scale(1.03);
        color: #0062B1;
    }
    .p-btn--white a:hover::after{
        background: var(--color_grad-blue-over);
    }
}
@media (max-width:768px){
    .p-btn--white a{
        max-width: 280px;
    }
}




/*** ------------------------------------------------------------------------------ 

ページ内リンクズレ対策
ページ内リンクズレ対策

-----------------------------------------------------------------------------  ***/
.anchor{
    display: block;
    padding-top: 100px;
    margin-top: -100px;
}
.anchor01{
    display: block;
    padding-top: 167px;
    margin-top: -167px;
}
@media(max-width:768px){
	.anchor01{
		display: block;
		padding-top: 100px;
		margin-top: -100px;
	}
}


/*** ------------------------------------------------------------------------------ 

スクロールアニメーション

-----------------------------------------------------------------------------  ***/
/*----------------------------
scroll_fade ｜フェード出現
----------------------------*/
.scroll_fade {
    transition: 0.8s ease-in-out;
    opacity: 0;
}
.scroll_fade.on {
    opacity: 1.0;
}

/*----------------------------
scroll_up ｜下から上へ出現
----------------------------*/
.scroll_up {
    transition: 0.8s ease-in-out;
    transform: translateY(30px);
    opacity: 0;
}
.scroll_up.on {
	transform: translateY(0);
	opacity: 1.0;
	/*overflow: hidden;*/
}

/*----------------------------
scroll_fade ｜テキストの背景がフェードイン
----------------------------*/
.scroll_fade_txtbg span{
    overflow: hidden;
    display: inline-block;
}
.scroll_fade_txtbg span::after{
    transition: 0.5s ease-in-out;
    transform: translateX(-200px);
    opacity: 0;
}
.scroll_fade_txtbg.on span::after{
	transform: translateX(0);
	opacity: 1.0;
}

.timing02 {transition-delay: .2s;}
.timing03 {transition-delay: .4s;}
.timing04 {transition-delay: .6s;}
.timing05 {transition-delay: .8s;}
.timing06 {transition-delay: 1.0s;}
.timing07 {transition-delay: 1.2s;}
.timing08 {transition-delay: 1.4s;}



/*----------------------------
画像 | 左から右へ表示
----------------------------*/
.left_to_right img{
    opacity: 0;
}
.left_to_right.on img {
    max-width: 100%;
    animation-name: anime_left_to_right;
    animation-fill-mode: forwards;
    animation-duration: 1s;
    animation-iteration-count: 1;
    animation-timing-function: ease;
    animation-delay: 0s;
    animation-direction: normal;
    animation-delay: 0.2s;
}
@keyframes anime_left_to_right {
    0% {
        clip-path: polygon(0% 0%, 0% 0%, 0% 100%, 0% 100%);
        opacity: 0;
    }
    100% {
        clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
        opacity: 1;
    }
}



/*** ------------------------------------------------------------------------------ 

    タブ切り替え

-----------------------------------------------------------------------------  ***/
.tab-target{}
.tab-target.hide{ display: none;}




/*** ------------------------------------------------------------------------------ 

    もっと見るボタン

-----------------------------------------------------------------------------  ***/
.hidden {
    display: none;
}