/*ボタン設定
====================================================*/
.border-btn {
    text-align: center;
    margin-left: 128px;
}
@media screen 
 and (max-device-width: 700px) 
 and (min-device-width: 350px) 
{
    .border-btn {
        margin-left:0;
    }
}

@media only screen and (max-width: 320px) {
    .border-btn {
        text-align: left;
    }
}

.border-btn a {
    display: inline-block;
    max-width: 560px;
    width: 100%;
    border: 1px solid #000;
    padding: 24px;
    color: #000;
    text-decoration: none;
    position: relative;
}

@media only screen and (max-width: 768px) {
    .border-btn a {
        max-width: 330px;
        width: 100%;
    }
}

@media only screen and (max-width: 320px) {
    .border-btn a {
        padding: 24px 10px 24px 20px;
    }
}

.border-btn.white a {
    border: 1px solid #fff;
    color: #fff;
}

.border-btn.magenta a {
    border: 1px solid rgb(216, 0, 132);
    background: rgb(216, 0, 132);
    color: #fff;
}

.border-btn.round a {
    border-radius: 50px;
}

.border-btn.small_round a {
    max-width: 200px;
    max-height: 48px;
    padding: 10px;
    border-radius: 42px;
}


.border-btn a:hover {}

.border-btn a span {
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
}

.btn-lf-a {
    justify-content: center;
    align-items: center;
    text-decoration: none;
}

/* 色指定 */
.btn-lf-a.btn-lf-a-6d6e70 {
    color: #6d6e70
}

.btn-lf-a.btn-lf-a-ffffff {
    color: #ffffff
}

.btn-lf-a.btn-lf-a-000000 {
    color: #000
}

/* ホバー色指定 */
.btn-lf-a.btn-lf-a-6d6e70:hover,
.btn-lf-a.btn-lf-a-6d6e70:active,
.btn-lf-a.btn-lf-a-6d6e70:focus {
    color: #6d6e70
}

.btn-lf-a.btn-lf-a-ffffff:hover,
.btn-lf-a.btn-lf-a-ffffff:active,
.btn-lf-a.btn-lf-a-ffffff:focus {
    color: #ffffff
}

.btn-lf-a.btn-lf-a-000000:hover,
.btn-lf-a.btn-lf-a-000000:active,
.btn-lf-a.btn-lf-a-000000:focus {
    color: #000
}


.btn-lf-a-icon {
    display: inline-block !important;
    position: relative;
    vertical-align: middle;
}

.icon_set_right .btn-lf-a-icon {
    margin-left: 10px;
}

.icon_set_left .btn-lf-a-icon {
    margin-right: 10px;
}

/* アイコンサイズ指定 */
.btn-lf-a-24 .btn-lf-a-icon {
    width: 24px;
    height: 24px
}

.btn-lf-a-36 .btn-lf-a-icon {
    width: 36px;
    height: 36px
}

.btn-lf-a-50 .btn-lf-a-icon {
    width: 50px;
    height: 50px
}

.btn-lf-a-68 .btn-lf-a-icon {
    width: 68px;
    height: 68px
}

.btn-lf-a-icon::before {
    position: absolute;
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    opacity: 0;
    z-index: 0
}

.btn-lf-a-6d6e70 .btn-lf-a-icon::before {
    border: 1px solid #6d6e70
}

.btn-lf-a-ffffff .btn-lf-a-icon::before {
    border: 1px solid #ffffff
}

.btn-lf-a-000000 .btn-lf-a-icon::before {
    border: 1px solid #000
}

.btn-lf-a-icon svg {
    position: absolute;
    top: 0;
    left: 0
}

.btn-lf-a-6d6e70 .btn-lf-a-icon svg {
    fill: #6d6e70
}

.btn-lf-a-ffffff .btn-lf-a-icon svg {
    fill: #ffffff
}

.btn-lf-a-000000 .btn-lf-a-icon svg {
    fill: #000
}

.btn-lf-a-icon svg .circle {
    fill: none;
    stroke-width: 1px;
    width: 100%;
    height: 100%;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center
}

.btn-lf-a-6d6e70 .btn-lf-a-icon svg .circle {
    stroke: #6d6e70
}

.btn-lf-a-ffffff .btn-lf-a-icon svg .circle {
    stroke: #ffffff
}

.btn-lf-a-000000 .btn-lf-a-icon svg .circle {
    stroke: #000
}

.btn-lf-a-icon svg .arrow {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0)
}

a.btn-lf-a:hover .btn-lf-a-icon::before {
    opacity: .1
}

a.btn-lf-a:hover .btn-lf-a-icon svg .arrow {
    -webkit-animation: arrow 1.5s forwards ease-in-out;
    animation: arrow 1.5s forwards ease-in-out
}

a.btn-lf-a:hover .btn-lf-a-icon svg .circle {
    fill: transparent;
    stroke-width: 1;
    -webkit-animation: circle 2s forwards cubic-bezier(0.215, 0.61, 0.355, 1);
    animation: circle 2s forwards cubic-bezier(0.215, 0.61, 0.355, 1)
}

a.btn-lf-a-6d6e70.btn-lf-a:hover .btn-lf-a-icon svg .circle {
    stroke: #6d6e70
}

a.btn-lf-a-ffffff.btn-lf-a:hover .btn-lf-a-icon svg .circle {
    stroke: #ffffff
}

a.btn-lf-a-000000.btn-lf-a:hover .btn-lf-a-icon svg .circle {
    stroke: #000
}

a:hover .btn-lf-a .btn-lf-a-icon::before {
    opacity: .1
}

a:hover .btn-lf-a .btn-lf-a-icon svg .arrow {
    -webkit-animation: arrow 1.5s forwards ease-in-out;
    animation: arrow 1.5s forwards ease-in-out
}

a:hover .btn-lf-a .btn-lf-a-icon svg .circle {
    fill: transparent;
    stroke-width: 1;
    -webkit-animation: circle 2s forwards cubic-bezier(0.215, 0.61, 0.355, 1);
    animation: circle 2s forwards cubic-bezier(0.215, 0.61, 0.355, 1)
}

a:hover .btn-lf-a-6d6e70.btn-lf-a .btn-lf-a-icon svg .circle {
    stroke: #6d6e70
}

a:hover .btn-lf-a-ffffff.btn-lf-a .btn-lf-a-icon svg .circle {
    stroke: #ffffff
}

a:hover .btn-lf-a-000000.btn-lf-a .btn-lf-a-icon svg .circle {
    stroke: #000
}

.link_icon {
    display: inline-block;
    padding-left: 42px;
}

.link_icon.pdf::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 32px;
    height: 32px;
    background: url(../images/unused/download_tcm283-6930136_tcm283-2750236-32.svg) no-repeat;
    background-size: cover;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.link_icon.mov::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 32px;
    height: 32px;
    background: url(../images/unused/mov_tcm283-6930163_tcm283-2750236-32.svg) no-repeat;
    background-size: cover;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

.link_icon.newwin::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    display: block;
    width: 32px;
    height: 32px;
    background: url(../images/unused/newwin_tcm283-6929891_tcm283-2750236-32.svg) no-repeat;
    background-size: cover;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}


/*btn animation*/
@-webkit-keyframes arrow {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    10% {
        opacity: 0;
        -webkit-transform: translateX(50%);
        transform: translateX(50%)
    }

    25% {
        opacity: 0;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    40% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes arrow {
    0% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    10% {
        opacity: 0;
        -webkit-transform: translateX(50%);
        transform: translateX(50%)
    }

    25% {
        opacity: 0;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    40% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@-webkit-keyframes circle {
    0% {
        stroke-dasharray: 0 300;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    10% {
        stroke-dasharray: 50 100
    }

    20% {
        stroke-dasharray: 100 200
    }

    30% {
        stroke-dasharray: 150 300
    }

    40% {
        stroke-dasharray: 200 300
    }

    60% {
        stroke-dasharray: 300 300;
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@keyframes circle {
    0% {
        stroke-dasharray: 0 300;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    10% {
        stroke-dasharray: 50 100
    }

    20% {
        stroke-dasharray: 100 200
    }

    30% {
        stroke-dasharray: 150 300
    }

    40% {
        stroke-dasharray: 200 300
    }

    60% {
        stroke-dasharray: 300 300;
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

/*パーツアニメーション設定
====================================================*/

.fade-in {
    opacity: 0;
    transition: opacity 3s
}

.fade-in.is-animation {
    opacity: 1
}

.slide-side-in {
    opacity: 0
}

.slide-side-in.is-animation {
    -webkit-animation-name: SlideSideIn;
    animation-name: SlideSideIn;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@keyframes SlideSideIn {
    0% {
        opacity: 0;
        -webkit-transform: translateX(300px);
        transform: translateX(300px)
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.slide-up-in>* {
    opacity: 0;
    -webkit-transform: translateY(100px);
    -ms-transform: translateY(100px);
    transform: translateY(100px);
    -webkit-transition: opacity 1.1s, -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    transition: opacity 1.1s, -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: opacity 1.1s, transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    transition: opacity 1.1s, transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    transition: opacity 1.1s, transform 1s cubic-bezier(0.19, 1, 0.22, 1),
        -webkit-transform 1s cubic-bezier(0.19, 1, 0.22, 1);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: transform, opacity;
    transition-property: transform, opacity;
    transition-property: transform, opacity, -webkit-transform
}

.slide-up-in.is-animation>* {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0)
}

.slide-up-in.is-animation>*:nth-child(1) {
    -webkit-transition-delay: .35s;
    -o-transition-delay: .35s;
    transition-delay: .35s
}

.slide-up-in.is-animation>*:nth-child(2) {
    -webkit-transition-delay: .5s;
    -o-transition-delay: .5s;
    transition-delay: .5s
}

.slide-up-in.is-animation>*:nth-child(3) {
    -webkit-transition-delay: .65s;
    -o-transition-delay: .65s;
    transition-delay: .65s
}

.slide-up-in.is-animation>*:nth-child(4) {
    -webkit-transition-delay: .8s;
    -o-transition-delay: .8s;
    transition-delay: .8s
}

.slide-up-in.is-animation>*:nth-child(5) {
    -webkit-transition-delay: .95s;
    -o-transition-delay: .95s;
    transition-delay: .95s
}

.slide-up-in.is-animation>*:nth-child(6) {
    -webkit-transition-delay: 1.1s;
    -o-transition-delay: 1.1s;
    transition-delay: 1.1s
}

.slide-up-in.is-animation>*:nth-child(7) {
    -webkit-transition-delay: 1.25s;
    -o-transition-delay: 1.25s;
    transition-delay: 1.25s
}

.slide-up-in.is-animation>*:nth-child(8) {
    -webkit-transition-delay: 1.4s;
    -o-transition-delay: 1.4s;
    transition-delay: 1.4s
}

.slide-up-in.is-animation>*:nth-child(9) {
    -webkit-transition-delay: 1.55s;
    -o-transition-delay: 1.55s;
    transition-delay: 1.55s
}

.slide-up-in.is-animation>*:nth-child(10) {
    -webkit-transition-delay: 1.7s;
    -o-transition-delay: 1.7s;
    transition-delay: 1.7s
}

/* START - blue-cyan component */
.blue-cyan {
    background: linear-gradient(to bottom right, rgb(36 0 176), rgb(0 231 239));
    margin: 0.6% 0 56px 0;
    display: flex;
    width: 100%;
    align-items: center;
    gap: .5rem;
    justify-content: center;
    padding: 1%;
    flex-wrap: wrap;
    align-content: center;
}
.chilDiv {
    /* max-width: 42rem; */
    margin: 20px;
    min-width: 22%;
    color: white;
}
.chilDiv:nth-child(2) {
    border: solid 1px;
    padding: 25px;
    width: 26rem;
}
.chilDiv:nth-child(3) {
    color: white;
    border: solid 1px;
    padding: 25px;
    width: 26rem;
}
a.customLink {
    color: white;
    text-decoration: none;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
    vertical-align: center;
}
@media only screen and (min-width: 768px) and (max-width: 991px){
	.chilDiv {
		max-width:none;
	}
	.chilDiv:not(:first-child) {
		flex: 1;
	}
	.chilDiv:nth-child(1) {
		width: 100%;
		text-align: center;
	}
	.chilDiv:not(:first-child) {
		flex: 1;
	}
}

@media only screen and (min-width: 320px) and (max-width: 600px){
	.blue-cyan {
    justify-content: space-evenly;

	}
    .blue-cyan {
        flex-direction: column;
    }
}
/* blue-cyan component - END*/



/*===========================================================*/
/* glovia-summit-gc
/*===========================================================*/

.section.diff-bg-glovia-summit-d.lightBG {
    background: #efefef;
	color: #000;
}


.blue-cyan-header {
    font-size: 2.4rem;
    font-weight: 800;
}
