@font-face {
  font-family: 'din';
  src: url('../../../img/special/agu-tf2025/DIN Condensed Bold.ttf') format('truetype');
}
.btn_page_top,
.p-pop__inner {
  display: none;
}
a:hover {
  filter: brightness(1.26);
  opacity: 1;
}
.sp_view {
  overflow: hidden;
}
.slick-dots {
  bottom: 1.8%;
}
.slick-dots li button:before {
  color: #3BA6B1;
}
.slick-dots li.slick-active button:before {
  color: #3BA6B1;
}
.slick-dots li {
    width: 10px;
    height: 10px;
    margin: 0 3px;
}
.slick-dots li button {
    width: 10px;
    height: 10px;
    padding: 3px;
}
.slick-dots li button:before {
    font-size: 3px;
    line-height: 10px;
    width: 10px;
    height: 10px;
}

/*-------------
PCとSP 別view
-------------*/
@media only screen and (max-width: 750px), print {
    .pc_view {
        display: none !important;
    }
    .sp_view {
        display: block !important;
    }

    .p-mainvisual__inner.l-inner {
        position: relative;
    }
    h1.mainvisual__logo {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translateY(-50%) translateX(-50%);
        -webkit- transform: translateY(-50%) translateX(-50%);
        width: 75%;
    }
}
@media only screen and (min-width: 751px), print {
    .pc_view {
        display: block !important;
    }
    .sp_view {
        display: none !important;
    }

    h1.mainvisual__logo {
        margin: auto;
        width: 46%;
    }
}



/*-------------
コンセプト PC
-------------*/
.new_content {
    width: 100vw;
	/*height: 150vw;*/
    background-image: url(../../../img/special/agu-tf2025/aogaku_bg.png);
    background-size: contain;
	background-position: top;
    background-repeat: repeat-x;
	margin-top: -12%;
}
.new_inner {
    max-width: 1360px;
    margin: 7.5% auto 0;
}
.new_wrap1 {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    padding: 6% 0 0 6%;
    margin: 0 0% 0 0;
}
.new_wrap2 {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 4.5% 0 6% 0;
    margin: 0 0 0 0%;
}
.p-leadSect__item.gapr {
	padding-right: 3%;
}
.p-leadSect__item.gapt {
    width: 75%;
    margin-top: 4.8%;
}



/*-------------
コンセプト SP
-------------*/
.sp_content {
    width: 100vw;
	height: 222vw;
    background-image: url(../../../img/special/agu-tf2025/aogaku_sp_bg.png);
    background-size: cover;
	background-position: top;
    margin-top: 44vw;
}
.sp_wrap1 {
    display: flex;
    justify-content: flex-end;
    padding: 0 0 4.5vw 12vw;
}
.sp_wrap2 {
    display: flex;
    justify-content: flex-start;
    padding: 0 18vw 4.5vw 0;
}
.sp_wrap3 {
    display: flex;
    justify-content: flex-start;
    padding: 0 24vw 4.5vw 4.5vw;
}
.sp_wrap4 {
    display: flex;
    justify-content: flex-end;
    padding: 0 7.2vw 0 18vw;
}
.p-leadSect__item.spr {
	padding-right: 1.8vw;
}



/*-------------
追加css
-------------*/
.p-aogakuWapper {
    background: #000;
}
.airspace {
    margin-top: 2.4rem;
}
.p-leadSect__lead>span, .p-leadSect__lead>strong {
    background-color: transparent;
    color: #fff;
}



@media only screen and (max-width: 750px), print {
    .p-leadSect__title.uno {
        width: 100%;
        margin-top: -20.4%;
    
    }
    .p-leadSect__photo.uno {
        width: 96%;
        margin: -32% auto 0;
    }
    p.p-leadSect__lead.-lead1.uno {
        font-size: 3.6vw;
        letter-spacing: 0.3vw;
        line-height: 0.75;
        text-align: center;
        margin: 10% 0 0 0.8vw;
    }
}

@media only screen and (min-width: 751px), print {
    .p-leadSect__photo.uno {
        width: 169%;
    }
    .p-leadSect__title.uno {
        margin: 1.8vw 0 0 10.5vw;
    }
    .p-leadSect__lead.uno {
        margin: 54% 0 0 75%;
    }
}

@media only screen and (min-width: 1361px), print {
    .p-leadSect__photo.uno {
        margin: 0;
    }
    .p-leadSect__title.uno {
        margin: 30px 0 0 140px;
    }
    .p-leadSect__item.-item1 .p-leadSect__lead.uno {
        font-size: 24px;
    }
}



/*-----------------
Sect（タイトル系）
-----------------*/
section.p-productSect,
section.p-gallerySect {
    color: #fff;
}
section.p-productSect.uno {
    margin-top: -7.2vw;
}
section.p-gallerySect.dos {
    margin-top: 5.4vw;
	overflow: hidden;
}
@media only screen and (min-width: 751px), print {
    section.p-productSect.uno {
        margin-top: 0%;
    }
    section.p-gallerySect.dos {
        margin-top: 6%;
    }
    .dos p.p-gallerySect__lead {
        margin-bottom: -9%;
    }
}
@media only screen and (min-width: 1361px), print {
    section.p-productSect.uno {
        /*margin-top: -490px;*/
    }
}

h2.f-en {
    font-family: 'din', sans-serif;
    color: #3BA6B1;
    letter-spacing: 0.06rem;
}
h2.f-en span {
    position: absolute;
    left: 50%;
    display: block;
    height: 2px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    background: #3BA6B1;
    color: transparent;
    margin-top: -1.8%;
}

.c-borderTit01 {
    font-weight: bold;
    line-height: 1.2;
    position: relative;
    padding-bottom: .3em;
    text-align: center
}
.c-borderTit01.-white {
    color: #fff
}

section.p-productSect.uno .l-inner {
    max-width: none;
}



/*-------------
PRODUCT
-------------*/
.pro-wrap {
    width: 100vw;
    background-size: cover;
    background-position: top;
    margin-top: 3%;
	align-items: flex-end;
}
.pro-wrap.odd {
    display: flex;
    justify-content: flex-end;
    padding: 3% 9% 3% 0;
}
.pro-wrap.even {
    display: flex;
    justify-content: flex-start;
    padding: 3% 0 3% 9%;
}
.pro-wrap.uno {
    background-image: url(../../../img/special/agu-tf2025/product_bg_01.jpg);
}
.pro-wrap.dos {
    background-image: url(../../../img/special/agu-tf2025/product_bg_02.jpg);
}
.pro-wrap.tres {
    background-image: url(../../../img/special/agu-tf2025/product_bg_03.jpg);
}
.pro-wrap.cuatro {
    background-image: url(../../../img/special/agu-tf2025/product_bg_04.jpg);
}
.pro-wrap.cinco {
    background-image: url(../../../img/special/agu-tf2025/product_bg_05.jpg);
}
.pro-wrap.seis {
    background-image: url(../../../img/special/agu-tf2025/product_bg_06.jpg);
}
@media only screen and (max-width: 750px), print {
  .pro-wrap.uno {
    background-image: url(../../../img/special/agu-tf2025/product_bg_sp_01.jpg);
  }
  .pro-wrap.dos {
    background-image: url(../../../img/special/agu-tf2025/product_bg_sp_02.jpg);
  }
  .pro-wrap.tres {
    background-image: url(../../../img/special/agu-tf2025/product_bg_sp_03.jpg);
  }
  .pro-wrap.cuatro {
    background-image: url(../../../img/special/agu-tf2025/product_bg_sp_04.jpg);
  }
  .pro-wrap.cinco {
    background-image: url(../../../img/special/agu-tf2025/product_bg_sp_05s.jpg);
  }
  .pro-wrap.seis {
    background-image: url(../../../img/special/agu-tf2025/product_bg_sp_06.jpg);
  }
}
.pro-box {
    width: 32%;
    margin: 0% 0 0% 0%;
}
.pro-txt {
    margin-top: 8%;
}
.sttl {
    font-size: 16px;
    letter-spacing: 0.06rem;
}
.lttl {
    font-size: 21px;
}
.lttl .jp {
    letter-spacing: -0.12rem;
}
.lttl .en {
    letter-spacing: 0.18rem;
}
.wrap_price {
    font-size: 18px;
    letter-spacing: 0.12rem;
}
.wrap_price .tax {
        font-size: 66%;
    letter-spacing: 0.18rem;
}
.btn-wrap {
    margin-top: 4.5%;
}



.btn-wrap span {
	position: relative;
    background: rgb(16 150 173 / 60%);
	padding: 2.4% 18% 2.7% 15%;
    font-size: 24px;
    letter-spacing: 0.24rem;
}
.btn-wrap span::before { /* 背景の表示設定 */
    content: "";
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 30px;
    width: 21px; /* 横幅 */
    height: 21px; /* 高さ */
    border-radius: 50%; /* 角の丸み */
    border: solid 1.5px #fff;
}
.btn-wrap span::after { /* くの字の表示設定 */
    content: "";
    position: absolute;
    margin: auto;
    top: 0;
    bottom: 0;
    right: 39.6px;
    width: 6.6px;
    height: 7.2px;
    border-top: 1.5px solid #fff;
    border-right: 1.5px solid #fff;
    transform: rotate(45deg);
}

.slide-arrow {
    bottom: 0;
    cursor: pointer;
    margin: auto;
    position: absolute;
    top: 0;
    width: 18px;
    z-index: 6666;
    padding: 50% 0;
}
.next-arrow {
    right: 0;
}
.prev-arrow {
    left: 0;
}

.sttl,
.lttl,
.wrap_price {
	font-weight: bolder;
	text-shadow: 0 0  9px rgb(0 0 0 / 96%),
                 0 0 24px rgb(0 0 0 / 96%);
}



@media only screen and (max-width: 750px), print {
	.pro-wrap.odd {
		flex-direction: row-reverse;
		justify-content: space-between;
	}
	.pro-wrap.even {
		flex-direction: row;
		justify-content: space-between;
	}
    .p-productSect.uno .l-inner {
        padding: 0;
    }
    .pro-wrap {
        width: 100vw;
        background-size: cover;
        background-position: top;
        margin-top: 3%;
    }
    .pro-wrap.odd {
        padding: 4.2vw 9vw 4.2vw 0;
    }
    .pro-wrap.even {
        padding: 4.2vw 0 4.2vw 9vw;
    }
    .pro-box {
        width: 36%;
		margin: 3vw 0 0 0;
    }
	.pro-items {
		padding-bottom: 2vw;
	}
    .pro-txt {
        margin-top: 7.5vw;
    }

    .btn-wrap span {
        display: block;
        /* background: none; */
        padding: 0.72vw 7.2vw;
        font-size: 3.6vw;
        letter-spacing: 0.24rem;
        margin-top: -3vw;
		font-weight: bolder;
    }
    .btn-wrap span::before {
        right: 14px;
        width: 14px;
        height: 14px;
    }
    .btn-wrap span::after {
        right: 20px;
        width: 4px;
        height: 4px;
    }
    .slide-arrow {
        width: 12px;
    }

}

@media only screen and (min-width: 751px) and (max-width: 1220px), print {
	.btn-wrap span::before {
		right: 20px;
	}
	.btn-wrap span::after {
		right: 28.8px;
	}
}



.even .pro-name {
    text-align: right;
    margin-right: 4vw;
}
.odd .pro-name {
    text-align: left;
    margin-left: 4vw;
}

.pro-name .sttl {
    font-size: 3vw;
}
.pro-name .lttl {
    font-size: 4.3vw;
}

.pro-name .wrap_price {
    font-size: 4.1vw;
}
.pro-name b {
    font-size: 75%;
}



/*-------------
GALLERY
-------------*/
.p-linkSect__main div {
    margin: 3% auto 15%;
    text-align: center;
    width: 50%;
}
@media only screen and (max-width: 750px), print {
    .p-linkSect__main div {
        margin: 3vw auto 18vw;
        width: 75%;
    }
}





/*--さぐり--*/
.btn-wrap::after {
  transform: skewY(-10deg) scale(1, 0);
  height: 140px; // ボタンの高さによって調整
}
.btn-wrap:hover::after {
  transform: skewY(-10deg) scale(1, 1);
}