
p {
    font-size: 100%;
}

/*//////////// CONTENTS //////////////*/

#contents-top{
width: 100%;
position: relative;
padding-top: 145px;
}
@media screen and (max-width:1200px){
#contents-top{
padding-top: 142px;
}
}
@media screen and (max-width:780px){
#contents-top{
padding-top: 72px;
}
}

/*//// HERO ////*/

section#hero{
width: 100%;
aspect-ratio: 8 / 4.2;
background: url("https://gigaplus.makeshop.jp/drofficial/img2026/top2026/hero_bg.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
display: grid;
align-content: center;
align-items: center;
transition: 0.3s;
}
.top_slide_outer{
  width: 85%;
  max-width: 900px;
  margin: auto;
  position: relative;
}
.top_slide_wrap{
aspect-ratio: 8 / 4.5;
overflow: hidden;
border: solid 1px #fff;
display: flex;
align-items: center;
transition: 0.3s;
}
.top_slide_wrap img{
width: 100%;
height: 100%;
object-fit: cover;
}
.top_slide_wrap img.slide_sp{
display: none;
}
/* slick dots */
.top_slide_outer .slick-dots{
position: absolute;
bottom: -10px;
left: 0;
width: 100%;
text-align: center;
}

@media screen and (min-width:1600px){
section#hero{
aspect-ratio: 8 / 3.5;
}
}

@media screen and (max-width:1200px){
section#hero{
aspect-ratio: 8 / 5 ;
}
}

@media screen and (max-width:920px){
section#hero{
aspect-ratio: 8 / 7;
}
.top_slide_wrap{
aspect-ratio: 8 / 5.8;
}
.top_slide_outer{
  width: 82%;
  max-width: 82vw;
  margin: auto;
  position: relative;
}
.top_slide_wrap img.slide_sp{
display: block;
}
.top_slide_wrap img.slide_pc{
display: none;
}
}
@media screen and (max-width:675px){
section#hero{
aspect-ratio: 8 /8 ;
}
}



/*//// CATCH ////*/

section#top_catch{
text-align: center;
padding: 60px 0 0;
}
#catch_logo{
width: 110px;
margin: auto;
margin-bottom: 100px;
}
p.top_catch_lead{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
letter-spacing: 0.15em;
line-height: 2;
font-size: 95%;
}
.top_link_btn{
color: #fff;
font-size: 90%;
letter-spacing: 0.15em;
}
.top_link_btn a{
margin: auto;
margin-bottom: 2.5em;
background: #7479B9;
width: 90%;
max-width: 400px;
display: flex;
justify-content: center;
align-items: center;
height: 2.2em;
color: #fff;
text-decoration: none;
border-radius: 2px;
}
.top_link_btn a span{
position: relative;
display: inline-block;
}
.top_link_btn a span::before,
.top_link_btn a span::after {
  content: "";
  position: absolute;
  top: calc(58% - 0.5px);
  right: -1em;
  width: 8px;
  height: 1px;
  border-radius: 9999px;
  background-color: #fff;
  transform-origin: calc(100% - 0.5px) 55%;
}
.top_link_btn a span::before {
  transform: rotate(40deg);
}
.top_link_btn a span::after {
  transform: rotate(-40deg);
}
@media screen and (max-width:710px){
#catch_logo{
margin-bottom: 60px;
}
p.top_catch_lead {
width: 90%;
margin: 0 auto 30px;
text-align: left;
    font-family: "Noto Serif JP", serif;
    font-optical-sizing: auto;
    font-weight: 400;
    letter-spacing: 0.15em;
    line-height: 2;
    font-size: 95%;
}
p.top_catch_lead br{
display: none;
}
}


/*//// ITEM ////*/

section#top_item_list{
padding: 60px 0 0;
}
section#top_item_list h2{
text-align: center;
font-size: 110%;
font-weight: 500;
margin-bottom: 1em;
}
section#top_item_list h2 a{
position: relative;
width: 4.2em;
margin: auto;
letter-spacing: 0.05em;
text-decoration: none;
}
section#top_item_list h2 a::before,
section#top_item_list h2 a::after {
  content: "";
  position: absolute;
  top: calc(58% - 0.5px);
  right: -1.2em;
  width: 15px;
  height: 2px;
  border-radius: 9999px;
  background-color: #32B1A7;
  transform-origin: calc(100% - 0.5px) 55%;
}
section#top_item_list h2 a::before {
  transform: rotate(45deg);
}
section#top_item_list h2 a::after {
  transform: rotate(-45deg);
}
ul#top_cat_select{
display: flex;
justify-content: space-between;
flex-wrap: nowrap;
width: 95%;
max-width: 1000px;
margin: auto;
margin-bottom: 1em;
}
ul#top_cat_select li{
width: 32%;
text-align: center;
display: grid;
align-items: center;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
letter-spacing: 0.15em;
}
ul#top_cat_select li.diet{
color: #F27B84;
border: solid 1px #F27B84;
background: #FFF0F1;
}
ul#top_cat_select li.athlete{
color: #37B3D1;
border: solid 1px #37B3D1;
background: #E0F6FC;
}
ul#top_cat_select li.foods{
color: #E58155;
border: solid 1px #E58155;
background: #FCF4E2;
}
ul#top_cat_select li a{
display: flex;
height: 3.6em;
align-items: center;
justify-content: center;
}
ul#top_cat_select li.diet a{
position: relative;
color: #F27B84;
}
ul#top_cat_select li.athlete a{
position: relative;
color: #37B3D1;
}
ul#top_cat_select li.foods a{
position: relative;
color: #E58155;
}
ul#top_cat_select li.diet a:before {
  content: '';
  width: 28px;
  height: 28px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 1em;
  bottom: 0;
  margin: auto;
}
ul#top_cat_select li.diet a:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 1px #F27B84;
  border-right: solid 1px #F27B84;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 1.7em;
  bottom: 0;
  margin: auto;
}
ul#top_cat_select li.athlete a:before {
  content: '';
  width: 28px;
  height: 28px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 1em;
  bottom: 0;
  margin: auto;
}
ul#top_cat_select li.athlete a:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 1px #37B3D1;
  border-right: solid 1px #37B3D1;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 1.7em;
  bottom: 0;
  margin: auto;
}
ul#top_cat_select li.foods a:before {
  content: '';
  width: 28px;
  height: 28px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 1em;
  bottom: 0;
  margin: auto;
}
ul#top_cat_select li.foods a:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 1px #E58155;
  border-right: solid 1px #E58155;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 1.7em;
  bottom: 0;
  margin: auto;
}
@media screen and (max-width:710px){
section#top_item_list{
padding: 0 0 0;
}
ul#top_cat_select{
display: block;
justify-content: space-between;
flex-wrap: nowrap;
width: 100%;
max-width: 400px;
margin: auto;
margin-bottom: 1em;
}
ul#top_cat_select li{
width: 100%;
margin-bottom: 10px;
}
}



/*//// 商品選択パネル ////*/

.itemSelect{
  position: relative;
  width: min(1200px, 98%);
  margin: 2em auto;
}
/* 横スクロール領域 */
.itemSelect__viewport{
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;       /* Firefox */
}
.itemSelect__viewport::-webkit-scrollbar{ display:none; }

ul.itemSelect__list{
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  gap: 10px;
  padding: 0 48px;
  margin: 0;
  list-style: none;
}

ul.itemSelect__list li{ flex: 0 0 auto; }
.itemSelect--product .itemSelect__list li{ width: 175px; }
ul.itemSelect__list li img{ width: 100%; height: auto; display:block; }

/* 矢印 */
.itemSelect__arrow{
  display: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 0;
  background: rgba(255,255,255,.9);
  box-shadow: 0 4px 14px rgba(0,0,0,.12);
  cursor: pointer;
  z-index: 10; 
}
.itemSelect__arrow--prev{ left: 0; }
.itemSelect__arrow--next{ right: 0; }

/* はみ出した時だけ class 付与して切り替え */
.itemSelect.is-overflow ul.itemSelect__list{
  justify-content: flex-start;
}
.itemSelect.is-overflow .itemSelect__arrow{
  display: block;
}
.itemSelect__arrow{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: #fff;
  box-shadow: 0 4px 14px rgba(0,0,0,.12);
  cursor: pointer;
  z-index: 4;
  padding: 0;
}
.itemSelect__arrow--next::after{
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 4px;          /* 少し右寄せ */
  margin: auto;
  width: 8px;
  height: 8px;
  border-top: 1px solid #666;
  border-right: 1px solid #666;
  transform: rotate(45deg);
}
.itemSelect__arrow--prev::after{
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 4px;           /* 少し左寄せ */
  right: 0;
  margin: auto;
  width: 8px;
  height: 8px;
  border-top: 1px solid #666;
  border-left: 1px solid #666;
  transform: rotate(-45deg);
}



/*//// NEWS ////*/

section#top_news{
padding: 40px 0 60px;
}
.top_news_list_wrap{
width: 95%;
max-width: 940px;
margin: auto;
display: grid;
grid-template-columns: 220px 1fr;
}
.top_news_list_left{
text-align: center;
display: grid;
align-items: center;
align-content: center;
}
.top_news_list_right{
overflow-y: auto;
height: 164px;
}
li.news_list_unit{
display: flex;
border-bottom: solid 1px #CFCFCF;
line-height: 40px;
padding-left: 20px;
overflow-x: hidden;
}
p.news_list_date{
color: #B28F60;
width: 120px;
letter-spacing: 0.05em;
}
p.news_list_title{
word-break: keep-all;
}
.top_news_list_left p.en{
font-size: 90%;
color: #797171;
font-family: "Noto Serif JP", serif;
}
.top_news_list_left h2{
font-size: 130%;
}

@media screen and (max-width:780px){
.top_news_list_wrap{
margin: auto;
display: block;
}
.top_news_list_left{
width: 100%;
padding-bottom: 25px;
}
.top_news_list_right{
width: 100%;
height: 244px;
}
li.news_list_unit{
display: block;
border-bottom: solid 1px #CFCFCF;
line-height: 20px;
padding-left: 0;
height: 51px;
padding-top:9px;
}
p.news_list_date{
font-size: 90%;
width: auto;
}
p.news_list_title{
font-size: 95%;
}
}



/*//// BANNER1 ////*/

#top_vcopy_sp{
display: none;
}

/* ===== hero の外枠（幅100%・高さは比率ベースで可変）  ===== */
section#top_banner1{
  width: 100%;
  position: relative;
  overflow: hidden;
  aspect-ratio: 8 / 4.2;
  min-height: 750px;     /* 大きすぎ防止 */
  transition: 0.3s;
}
@media screen and (max-width:1580px){
section#top_banner1{
  aspect-ratio: 8 / 5;
}
}
@media screen and (max-width:1300px){
section#top_banner1{
  aspect-ratio: 8 / 6;
}
}

/* ===== 背景レイヤー ===== */
.hero__bg{
  position: absolute;
  inset: 0;
  z-index: 0;
}

/* polygon 全面カバー */

.bg__polygon{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  opacity: 0.6;
}

/* 野菜　下固定*/
.bg__veg{
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 40%;
  object-fit: cover;
  pointer-events: none;
}
.bg__veg{
  position: absolute;
  left: 0;
  right: 0;
  bottom: -12%;
  width: 100%;
  height: auto;
  object-fit: cover;
  z-index: 2;
  transition: 0.3s;
}

/* 半透明の覆い */
.bg__veil{
  position: absolute;
  inset: 0;
  background: #E3EAF0;
  opacity: .40;
  z-index: 3;
}

/* 人物　左寄せ */
.bg__woman{
  position: absolute;
  left: 9vw;
  top: 16%;
  height: 75%;
  max-height: 700px;
  width: auto;
  max-width: 48%;
  object-fit: contain;
  z-index: 4;
  transition: 0.3s;
}

/* ===== 前面　配置基準となる  ===== */
.hero__stage{
  position: absolute;
  inset: 0;
  z-index: 1;

  /* デザインの基準幅  */
  width: min(1200px, 100%);
  height: 100%;
  margin: 0 auto;
}

/* ===== circles  ===== */
.circle{
  position: absolute;
  height: auto;
  width: clamp(120px, 18vw, 220px);
  pointer-events: none;
}

.circle--amino{
  top: 12%;
  left: 28%;
  width: clamp(150px, 19vw, 270px);
}
.circle--mineral{
  top: 48%;
  left: 38%;
  width: clamp(130px, 14vw, 240px);
}
.circle--bitamin{
  top: 65%;
  left: 17%;
  width: clamp(120px, 11vw, 180px);
}


/* ===== 縦組み ===== */

/* 縦組み本体 */
.vtitle__jp{
position: absolute;
top: 10%;
right: 4%;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(32px, 3.2vw, 44px);
line-height: 1.2;
margin: 0;
letter-spacing: .08em;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
letter-spacing: 0.15em;
}

/* タテ英字 */
.vtitle__en{
position: absolute;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(10px, 1.1vw, 14px);
letter-spacing: .2em;
color: #c00;
justify-self: end;
top: 10%;
right: 1%;
}

/* ===== 縦組み本文 ===== */
.vcopy{
position: absolute;
top: 38%;
right: 18%;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(12px, 1.2vw, 14px);
line-height: 1.9;
margin: 0;
color: #222;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
}
.vcopy span{
text-combine-upright: all;
font-size: 105%;
letter-spacing: normal;
padding-bottom: 3px;
}

.vcopy span.padd{
/*
text-combine-upright: all;
position: relative;
left: -.38em;*/
}

@media screen and (max-width:1580px){
.bg__woman{
  left: 6%;
  bottom: 6%;
  height: 74%;
}
.vtitle__jp{
right: 9%;
}
.vtitle__en{
  right: 6%;
}
.vcopy{
  top: 34%;
  right: 22%;
}
.circle--amino{
  top: 12%;
  left: 39%;
}
.circle--mineral{
  top: 54%;
  left: 38%;
}
.circle--bitamin{
  top: 65%;
  left: 17%;
}
}
@media screen and (max-width:1300px){
.bg__woman{
left: 4%;
bottom: 15%;
height: 62%;
top: auto;
}
.bg__veg{
bottom: 0;
}
}
@media screen and (max-width:840px){
.bg__woman{
left: 0;
}
}
@media screen and (max-width:700px){
.bg__woman{
left:-5%;
}
}
@media screen and (max-width:710px){

#top_vcopy_sp{
display: block;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
letter-spacing: 0.15em;
padding: 30px 5%;
background: #f4f7f9;
}
#top_vcopy_sp p{
text-align: justify;
line-height: 1.8;
}

.vcopy{
display: none;
}
.vtitle__jp {
right: 11%;
}
.circle--mineral {
top: 54%;
left: 44%;
width: clamp(150px, 14vw, 240px);
}
.bg__woman {
height: 65%;
max-height: 750px;
max-width: 50%;
left: -8%;
bottom: 15%;
}
.bg__veg{
bottom: 0;
left: 50%;
transform: translateX(-50%);
right: auto;  
height: 32%; 
object-fit: cover;
}
}

@media screen and (max-width:500px){
section#top_banner1 {
min-height: 700px;
}
.bg__woman {
height: 60%;
max-height: 750px;
max-width: 55%;
left: -12%;
bottom: 15%;
}
.circle--amino {
top: 12%;
left: 33vw;
width: clamp(130px, 19vw, 270px);
}
.circle--mineral {
top: 50%;
left: 42%;
width: clamp(130px, 14vw, 240px);
}
}


/*//// BANNER1 -- BALANCE ////*/
section#top_balance{
  background: linear-gradient(180deg, #f4f7f9 0%, #f4f7f9 50%, #3B3B3B 50%, #3B3B3B 100%);
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.top_balance_banner{
width: 95%;
max-width: 1200px;
background: #fff;
padding: 50px 30px;
display: grid;
grid-template-columns: 1fr 1fr;
align-items: center;
}
.top_balance_left{
text-align: center;
justify-content: center;
}
.top_balance_left h4{
text-align: left;
color: #32B1A7;
font-size: clamp(16px, 2vw, 24px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
letter-spacing: 0.15em;
width: fit-content;
margin: 0 auto 20px;
}

.top_balance_left p.note{
font-size: 80%;
}
.top_balance_right{
width: 86%;
}
.top_balance_right p{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
font-size: 87.5%;
line-height: 1.8;
padding: 1em 0;
}
.top_balance_btn{
display: none;
}

@media screen and (max-width:840px){
.top_balance_banner{
width: 95%;
max-width: 1200px;
background: #fff;
padding: 30px 20px 20px;
display: grid;
grid-template-columns: 1fr;
align-items:flex-start;
}
.top_balance_left h4 {
text-align: center;
}
.top_balance_right{
width: 100%;
max-width: 600px;
margin: auto;
}
.top_link_btn a {
margin-bottom: 1.0em;
}
}
@media screen and (max-width:710px){
.top_balance_left h4{
font-size: 120%;
width: auto;
letter-spacing: 0.05em;
}
.top_balance_right p{
font-size: 100%;
}
}


/*//// BANNER2 ////*/
section#top_banner2{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 400;
background: #3B3B3B;
color: #fff;
padding: 60px 0;
}
.top_banner2_wrap{
width: 95%;
max-width: 1000px;
margin: auto;
display: flex;
}
.top_banner2_title{
width: 25%;
padding-top: 1.5em;
position: relative;
}
.top_banner2_title br{
display: none;
}
.banner2_graf1_note{
display: none;
}
.top_banner2_title h3{
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-size: clamp(20px, 2.4vw,34px);
  line-height: 1.9;
letter-spacing: 0.2em;
font-weight: 400;
position: absolute;
left: 15%;
}
.top_banner2_title .en{
position: absolute;
font-size: 12px;
writing-mode: vertical-rl;
text-orientation: mixed;
  justify-self: end;
  left:8%;
}
.top_banner2_text{
width: 75%;
}
.top_banner2_text h4 br{
display: none;
}
.top_banner2_text h4{
font-size: 24px;
font-weight: 300;
padding-bottom: 0.8em;
letter-spacing: 0.15em;
}
.top_banner2_text p{
font-size: 87.5%;
line-height: 1.8;
padding-bottom: 1.5em;
letter-spacing: 0.15em;
}
.banner2_graf1_sp{
display: none;
}

@media screen and (max-width:710px){
section#top_banner2{
background: url("https://gigaplus.makeshop.jp/drofficial/img2026/top2026/banner2_bg.jpg");
background-repeat: no-repeat;
background-size: 100%;
background-position: right top;
 background-color: #3b3b3b;
padding: 60px 0 10px;
}
.top_banner2_wrap {
display: block;
width: 92%;
}
.top_banner2_title {
width: 7em;
margin: auto;
padding-top: 0;
position: relative;
height: 18em;
}
.top_banner2_title h3{
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(28px, 3vw,34px);
line-height: 1.5;
letter-spacing: 0.2em;
font-weight: 400;
position: absolute;
left: 0;
}
.top_banner2_title .en{
right: 0;
}
.top_banner2_title br{
display: block;
}
.top_banner2_text {
    width: 100%;
}
.top_banner2_text h4 {
text-align: center;
}
.top_banner2_text h4 span{
display: none;
}
.top_banner2_text h4 br{
display: block;
}
.top_banner2_text p {
    font-size: 100%;
}
.banner2_graf1_pc{
display: none;
}
.banner2_graf1_sp{
display: block;
width: 100%;
text-align: center;
}
.banner2_graf1_note{
display: block;
width: 80%;
margin: 0 auto 40px;
background: #fff;
padding: 0.5em 0;
text-align: center;
font: 100% "Zen Kaku Gothic New", "Meiryo", Osaka, "郢晏�ﾎ帷ｹｧ�ｮ郢晄焔�ｧ蛛ｵ縺� Pro W3", arial, helvetica, clean, sans-serif;
}
.banner2_graf1_note p{
color: #222222;
padding-bottom: 0;
font-size: 87.5%;
line-height: 1.4;
font-weight: 500;
}
.banner2_graf1_note p.red{
color: #D11120;
padding-bottom: 0.25em;
}
}

/*//// REASON ////*/
section#top_reason {
padding: 60px 0;
}
#top_reason h3{
text-align: center;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
  font-size: clamp(20px,3.6vw,38px);
  letter-spacing: 0.10em;
}
#top_reason h3 br{
display: none;
}
#top_reason p{
text-align: center;
font-weight: 300;
  font-size: clamp(20px, 1.8vw,24px);
  letter-spacing: 0.10em;
}
.itemSelect--reason .itemSelect__list li{
text-align: center;
color: #fff;
font-size: 13px;
position: relative;
}
.itemSelect--reason .itemSelect__list li a{
color: #fff;
}
.itemSelect--reason .itemSelect__list li span{
display: block;
position: absolute;
bottom: 1em;
left: 0;
right: 0;
margin: auto;
}
.itemSelect--reason .itemSelect__list li{ width: 230px; }

@media screen and (max-width:710px){
.itemSelect--reason .itemSelect__list li {
    width: 35%;
}
#top_reason p{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-size: clamp(18px,4vw,22px);
padding-bottom: 1em;
}
#top_reason h3{
text-align: center;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
  font-size: clamp(28px,3.8vw,40px);
  letter-spacing: 0.10em;
}
#top_reason h3 br{
display: block;
}
}

/*//// BANNER3 ////*/
section#top_banner3{
}
.banner3_panel{
background: #F5F5F5;
text-align: center;
width: 95%;
max-width: 1200px;
margin: auto;
padding: 50px 20px 30px;
}
.banner3_panel h3{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
color: #D11120;
  font-size: clamp(20px,3.6vw,30px);
  letter-spacing: 0.10em;
  padding-bottom: 1.5em;
}
.banner3_panel h3 br{
display: none;
}
.banner3_panel p{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.10em;
font-size: 87.5%;
line-height: 1.8;
letter-spacing: 0.1em;
}
.banner3_gray{
width: fit-content;
margin: 1.5em auto;
padding: 15px 50px;
background: #ececec;
}
.banner3_panel .banner3_gray p{
font-size: 100%;
}
@media screen and (max-width:710px){

.banner3_panel {
    background: none;
    text-align: center;
    width: 100%;
    margin: auto;
    padding: 0 25px 10px;
	background: linear-gradient(0deg,rgba(245, 245, 245, 1) 10%, rgba(255, 255, 255, 1) 100%);
}
.banner3_panel h3{
  font-size: clamp(24px,3.6vw,30px);
}
.banner3_panel h3 br{
display: block;
}
.banner3_panel p{
text-align: justify;
font-size: 100%;
}
.banner3_panel p br{
display: none;
}
section#top_banner3 .top_link_btn {
    letter-spacing: 0;
}
section#top_banner3 .top_link_btn a{
max-width: 100%;
}
.banner3_gray p{
font: 100% "Zen Kaku Gothic New", "Meiryo", Osaka, "郢晏�ﾎ帷ｹｧ�ｮ郢晄焔�ｧ蛛ｵ縺� Pro W3", arial, helvetica, clean, sans-serif;
}
}


/*//// BANNER4 ////*/

section#top_banner4{
padding: 40px 0;
text-align: center;
margin-bottom: 250px;
}
.top_banner4_title{
background: #D11120;
color: #fff;
font-size: 150%;
padding: 0.25em;
width: 90%;
max-width: 1200px;
margin: auto;
}
#top_banner4 h3{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-size: clamp(20px,3.8vw,36px);
letter-spacing: 0.10em;
padding: 0.25em 0;
}
#top_banner4 h3 br{
display: none;
}
.top_banner4_wrap{
position: relative;
width: 100%;
padding: clamp(30px,10vw,110px) 0;
background: url("https://gigaplus.makeshop.jp/drofficial/img2026/top2026/banner4_bg.jpg");
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
align-items: center;
display: flex;
margin-top: 90px;
}
.top_banner4_plate{
width: 90%;
max-width: 1200px;
background: #fff;
padding: 70px 0;
margin: auto;
}
.top_banner4_plate h4{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
color: #D11120;
font-size: clamp(24px,3.6vw,30px);
line-height: 1.8;
letter-spacing: 0.10em;
padding-bottom: 0.5em;
}
.top_banner4_plate p{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 200;
font-size: clamp(18px,2.6vw,22px);
letter-spacing: 0.10em;
line-height: 2.6;
}
.top_banner4_line{
position: absolute;
left: 0;
right: 0;
top: -80px;
margin: auto;
height: 150px;
width: 4px;
background: #D11120;
}
.banner4_support_wrap{
width: 90%;
max-width: 1000px;
margin: auto;
position: absolute;
left: 0;
right: 0;
bottom: -250px;
display: flex;
justify-content:space-between;
}
.banner4_support{
width: 30%;
aspect-ratio: 1 / 1;
color: #fff;
background: #D11120;
text-align: center;
display: grid;
grid-template-rows: 1fr 1fr;
align-items: center;
}
.support_icon{
display: grid;
align-self: end;
}
.support_icon img{
width: 80px;
height: 80px;
margin: auto;
}
.banner4_support_arrow{
width: 5%;
text-align: center;
display: grid;
align-items: center;
align-content: center;
}
.support_arrow {
position: relative;
display: inline-block;
margin: auto;
width: 10px;
height: 15px;
}
.support_arrow::before,
.support_arrow::after {
content: "";
position: absolute;
top: calc(50% - 0.5px);
right: 0;
width: 12.4px;
height: 1px;
border-radius: 9999px;
background-color: #e40000;
transform-origin: calc(100% - 0.5px) 50%;
}
.support_arrow::before {
  transform: rotate(37.85deg);
}
.support_arrow::after {
  transform: rotate(-37.85deg);
}
section#top_banner4 br.onlysp{
display: none;
}

@media screen and (max-width:1000px){
section#top_banner4{
margin-bottom: 20vw;
}
.banner4_support_wrap{
bottom: -20vw;
}
}
@media screen and (max-width:750px){

.banner4_support{
font-size: 13px;
}
.support_icon img{
width: 60px;
height: 60px;
}
}
@media screen and (max-width:710px){
.top_banner4_title {
    font-size: 110%;
    padding: 0.25em;
    width: 80%;
    margin: auto;
}

#top_banner4 h3{
font-size: clamp(28px,4vw,36px);
letter-spacing: 0.2em;
}
#top_banner4 h3 br{
display: block;
}

.banner4_support{
width: 32%;
font-size: 2.5vw;
}
.support_icon img{
width: 50px;
height: 50px;
margin: auto;
}
.banner4_support_arrow{
width: 3%;
}
.top_banner4_wrap {
    margin-top: 40px;
}
.top_banner4_line {
    top: -35px;
    margin: auto;
    height: 70px;
}
section#top_banner4 br.onlysp{
display: block;
}
section#top_banner4 br.onlypc{
display: none;
}

}

/*//// SUPPORT RESEARCH ////*/

section#top_research{
display: grid;
padding-bottom: 50px;
padding-top: 30px;
grid-template-columns: 1fr 930px;
}
.top_research_pic{
width: 100%;
}
.top_research_txt{
display: grid;
align-content: center;
width: 100%;
position: relative;
}
.top_research_txt_sp{
display: none;
}
.top_research_txt h4 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(14px, 1.5vw, 20px);
position: absolute;
right:8vw;
font-weight: 400;
color: #D11120;
letter-spacing: 0.15em;
}
.top_research_txt h3 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(20px, 2.6vw, 38px);
position: absolute;
right:10vw;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
}
.top_research_txt p {
position: absolute;
top: 40%;
right:20vw;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(12px, 1.2vw, 14px);
line-height: 1.9;
margin: 0;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
}
.support_link{
position: absolute;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-size: 80%;
letter-spacing: 0.15em;
padding-right: 2em;
border-bottom: solid 1px #999;
display: inline-block;
align-items: center;
}
.top_research_txt .support_link{
right:23vw;
bottom: 15%;
}
.support_link a:before {
content: '';
width: 32px;
height: 32px;
background: #D11120;
border-radius: 50%;
position: absolute;
top: 0;
right: -1.2em;
bottom: 0;
margin: auto;
}
.support_link a:after {
content: '';
width: 8px;
height: 8px;
border: 0;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
transform: rotate(45deg);
position: absolute;
top: 0;
right: -0.15em;
bottom: 0;
margin: auto;
}


/*//// SUPPORT ANALYSIS ////*/

section#top_analysis{
display: grid;
justify-content: space-between;
padding-bottom: 50px;
grid-template-columns: 930px 1fr ;
}
.top_analysis_pic{
order: 0;
padding-left: 10%;
}
.top_analysis_pic img.support_pic_sp{
display: none;
}
.top_analysis_txt_sp{
display: none;
}
.top_analysis_txt{
order: 1;
display: grid;
align-content: center;
width: 100%;
position: relative;
}
.top_analysis_txt h4 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(14px, 1.5vw, 20px);
position: absolute;
left:28vw;
font-weight: 400;
color: #D11120;
letter-spacing: 0.15em;
}
.top_analysis_txt h3 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(20px, 2.6vw, 38px);
position: absolute;
left:24vw;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
}
.top_analysis_txt p {
position: absolute;
top: 23%;
left:15vw;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(12px, 1.2vw, 14px);
line-height: 1.9;
margin: 0;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
}

.top_analysis_txt .support_link{
position: absolute;
right:auto;
left: 15vw;
bottom: 20%;
}

/*//// SUPPORT ADVICE ////*/

section#top_advice{
display: grid;
padding-bottom: 50px;
grid-template-columns: 1fr 930px;
}
.top_advice_pic{
width: 100%;
}
.top_advice_pic img.support_pic_sp{
display: none;
}
.top_advice_txt_sp{
display: none;
}
.top_advice_txt{
display: grid;
align-content: center;
width: 100%;
position: relative;
}
.top_advice_txt h4 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(14px, 1.5vw, 20px);
position: absolute;
right:10.5vw;
font-weight: 400;
color: #D11120;
letter-spacing: 0.15em;
}
.top_advice_txt h3 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(20px, 2.6vw, 38px);
line-height: 1.0;
position: absolute;
right:13vw;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
}
.top_advice_txt h3 span{
font-size: 50%;
padding-top: 0.5em;
display: inline-block;
}
.top_advice_txt p {
position: absolute;
top: 20%;
right:20vw;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(12px, 1.2vw, 14px);
line-height: 1.9;
margin: 0;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
}
.top_advice_txt .support_link{
right:21vw;
bottom: 12%;
}

.analysis_btn{
display: grid;
grid-template-columns: 65% 35%;
width: 90%;
max-width: 900px;
margin: auto;
margin-bottom: 50px;
border: solid 2px #D11120;
padding: 1em;
align-items: center;
font-size: 110%;
text-align: center;
}
.analysis_btn span{
padding: 0 0.4em;
}
.analysis_btn_link{
color: #fff;
text-align: center;
font-size: 87.5%;
}
.analysis_btn_link a{
display: block;
color: #fff;
width: 15em;
line-height: 1;
padding: 0.3em;
background: #010101;
}
.analysis_btn br{
display: none;
}


@media screen and (max-width:1445px){
section#top_research{
grid-template-columns: 1fr 65%;
}
section#top_analysis{
grid-template-columns: 65% 1fr ;
}
section#top_advice{
grid-template-columns: 1fr 60%;
}
.top_research_txt h4 {
right:4vw;
}
.top_research_txt h3 {
right:6vw;
}
.top_research_txt p {
top: 16vw;
right:16vw;
}
.top_analysis_txt h4 {
left: auto;
right:9vw;
}
.top_analysis_txt h3 {
left: auto;
right:12vw;
}
.top_analysis_txt p {
top: 20%;
right:18vw;
}
.top_advice_txt h4 {
right:4vw;
}
.top_advice_txt h3 {
right:7.5vw;
}
.top_advice_txt p {
top: 15%;
right:16vw;
}
.support_link{
font-size: 75%;
}
.top_research_txt .support_link{
right: auto;
left:8vw;
bottom: 9%;
}
.top_analysis_txt .support_link{
right: auto;
left:8vw;
bottom: 9%;
}
.top_advice_txt .support_link{
right:18vw;
bottom: 0;
}
}
@media screen and (max-width:1200px){
.top_advice_txt p br{
display: none;
}
.top_advice_txt p {
height: 80%;
top: 14%;
right:16vw;
}
.top_analysis_txt .support_link {
right: auto;
left: 8vw;
bottom: 0;
}
}

@media screen and (max-width:920px){
.top_research_txt .support_link {
right: auto;
left: 8vw;
bottom: 0
}
.top_analysis_txt .support_link {
right: auto;
left: 8vw;
bottom: -2vw;
}
.top_research_txt p {
top: 8vw;
right:16vw;
}
.top_analysis_txt h4 {
left: auto;
right:4vw;
}
.top_analysis_txt h3 {
left: auto;
right:7vw;
}
.top_analysis_txt p {
top: 0;
right:14vw;
}
}

@media screen and (max-width:800px){
.analysis_btn {
    display: block;
    width: 90%;
    max-width: 900px;
    margin: auto;
    margin-bottom: 50px;
    border: solid 2px #D11120;
    padding: 1em;
    align-items: center;
    font-size: 110%;
    text-align: center;
}
.analysis_btn_link a{
margin: 10px auto 0;
}
}
@media screen and (max-width:710px){
section#top_research{
display: block;
padding-bottom: 10px;
padding-top: 30px;
position: relative;
}
section#top_analysis{
display: grid;
justify-content: space-between;
padding-bottom: 10px;
grid-template-columns: 1fr 22% ;
}
section#top_advice{
display: block;
padding-bottom: 10px;
padding-top: 30px;
position: relative;
}
.top_research_txt_sp{
display: block;
padding: 20px 0;
width: 90%;
margin:0 auto 50px; 
}
.top_research_txt_sp p {
font-size: 100%;
line-height: 1.9;
margin: 0;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
padding-bottom: 1.5em;
}
.top_research_txt_sp .support_link{
position: relative;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-size: 80%;
letter-spacing: 0.15em;
padding-right: 2em;
border-bottom: solid 1px #999;
display: inline-block;
align-items: center;
}
.top_research_txt p{
display: none;
}
.top_research_txt .support_link{
display: none;
}
.top_analysis_txt_sp{
display: block;
padding: 20px 0;
width: 90%;
margin:0 auto 50px; 
}
.top_analysis_txt_sp p {
font-size: 100%;
line-height: 1.9;
margin: 0;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
padding-bottom: 1.5em;
}
.top_analysis_txt_sp .support_link{
position: relative;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-size: 80%;
letter-spacing: 0.15em;
padding-right: 2em;
border-bottom: solid 1px #999;
display: inline-block;
align-items: center;
}
.top_analysis_txt p{
display: none;
}
.top_analysis_txt .support_link{
display: none;
}
.top_research_txt{
background: #fff;
position: absolute;
z-index: 2;
right: 3%;
top: 0;
width: 21vw;
height: 80%;
align-content: flex-start;
display: grid;
grid-template-columns: 1fr 30px;
}
.top_research_txt h4 {
position: relative;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(14px, 1.5vw, 20px);
font-weight: 400;
color: #D11120;
letter-spacing: 0.15em;
margin-right: 0;
right: 3vw;
order: 1;
}
.top_research_txt h3 {
position: relative;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(26px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
right: 2vw;
order: 0;
}
.top_research_pic {
position: relative;
z-index: 0;
aspect-ratio: 4 / 2.4;
overflow: hidden;
}
.top_research_pic img{
max-width: 150%;
height: 100%;
width: 100%;
object-fit: cover;
}
.top_analysis_txt{
background: #fff;
z-index: 2;
top: 0;
display: grid;
grid-template-columns: 1fr 30px;
}
.top_analysis_txt h4 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(14px, 1.5vw, 20px);
font-weight: 400;
color: #D11120;
letter-spacing: 0.15em;
left: auto;
right:6vw;
}
.top_analysis_txt h3 {
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(26px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
left: auto;
right:10vw;
}
.top_advice_txt_sp{
display: block;
padding: 20px 0;
width: 90%;
margin:0 auto 50px; 
}
.top_advice_txt_sp p {
font-size: 100%;
line-height: 1.9;
margin: 0;
font-family: "Noto Serif JP", serif;
font-weight: 400;
letter-spacing: 0.15em;
padding-bottom: 1.5em;
}
.top_advice_txt_sp .support_link{
position: relative;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-size: 80%;
letter-spacing: 0.15em;
padding-right: 2em;
border-bottom: solid 1px #999;
display: inline-block;
align-items: center;
}
.top_advice_txt p{
display: none;
}
.top_advice_txt .support_link{
display: none;
}
.top_advice_txt{
background: #fff;
position: absolute;
z-index: 2;
right: 3%;
top: 0;
width: 21vw;
height: 80%;
align-content: flex-start;
display: grid;
grid-template-columns: 1fr 30px;
}
.top_advice_txt h4 {
position: relative;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(14px, 1.5vw, 20px);
font-weight: 400;
color: #D11120;
letter-spacing: 0.15em;
margin-right: 0;
right: 3vw;
order: 1;
}
.top_advice_txt h3 {
position: relative;
writing-mode: vertical-rl;
text-orientation: mixed;
font-size: clamp(26px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
line-height: 1.4;
right: 2vw;
order: 0;
}
.top_advice_txt h3 span{
font-size: 70%;
padding-top: 0.25em;
display: inline-block;
}
.top_advice_pic img.support_pic_pc{
display: none;
}
.top_advice_pic img.support_pic_sp{
display: block;
}

.analysis_btn{
display: block;
}
}


@media screen and (max-width:600px){
.top_research_pic {
aspect-ratio: 4 / 3;
}
.top_research_txt{
width: 24vw;
height: 80%;
}
.top_advice_pic {
aspect-ratio: 4 / 3;
}
.top_advice_pic img{
max-width: 150%;
height: 100%;
width: 100%;
object-fit: cover;
}
.top_advice_txt{
width: 24vw;
height: 80%;
}
.top_analysis_pic img.support_pic_pc{
display: none;
}
.top_analysis_pic img.support_pic_sp{
display: block;
}
.top_advice_txt h3 {
line-height: 1.25;
}
.analysis_btn br{
display: block;
}
}
@media screen and (max-width:500px){
.top_research_pic {
aspect-ratio: 4 / 4;
}
.top_research_txt{
width: 28vw;
height: 70%;
}
.top_research_txt h3 {
right: 2vw;
order: 0;
}
.top_advice_txt{
width: 24.5vw;
height: 90%;
}
}
@media screen and (max-width:499px){
.top_research_txt h3 {
right: 0;
order: 0;
font-size: 24px;
}
.top_advice_txt h3 {
line-height: 1.0;
}
}



/*//// SUPPLEMENT ////*/
#top_supplement{
text-align: center;
}
.top_supplement_head{
width: 100%;
background: #D11120;
color: #fff;
padding: 30px 0;
}
.top_supplement_head h3{
font-size: clamp(26px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
padding-bottom: 0.25em;
}
.top_supplement_head p{
font-size: 80%;
letter-spacing: 0.15em;
font-weight: 300;
}
.top_supplement_head p br{
display: none;
}
.top_supplement_pic{
width: 100%;
aspect-ratio: 3 / 1.2;
overflow: hidden;
}
.top_supplement_pic img{
width: 100%;
height: 100%;
object-fit: cover;
}
.top_supplement_txt{
padding: 60px 0 40px;
}
.top_supplement_txt h4{
font-size: 150%;
line-height: 1.6;
font-weight: 500;
}
.top_supplement_txt h4 br{
display: none;
}
.top_supplement_txt p{
font-size: 140%;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.15em;
}
.top_supplement_txt p br{
display: none;
}
.top_supplement_txt h5{
font-size: 110%;
font-weight: 500;
color: #0000FF;
padding: 4em 0 1.5em;
}
.top_supplement_txt h5 br{
display: none;
}

#top_supplement .top_link_btn{
letter-spacing: 0;
}
#top_supplement .top_link_btn a{
max-width: 430px;
}

@media screen and (max-width:1600px){
.top_supplement_pic{
width: 100%;
aspect-ratio: 3 / 1.6;
overflow: hidden;
}
}

@media screen and (max-width:710px){
.top_supplement_pic{
width: 100%;
aspect-ratio: 3 / 1.9;
overflow: hidden;
}
.top_supplement_txt{
padding: 40px 0 40px;
width: 90%;
margin: auto;
}
.top_supplement_txt h4{
font-size: 4.5vw;
padding-bottom: 0.5em;
}
.top_supplement_txt h4 br{
display: block;
}
.top_supplement_txt p{
font-size: 3.8vw;
text-align: center;
}
.top_supplement_txt p br{
display: block;
}
.top_supplement_txt h5 br{
display: block;
}
#top_supplement .top_link_btn a{
max-width: 100%;
}
}
@media screen and (max-width:600px){
.top_supplement_head p br{
display: block;
}
}

/*//// TRAINER ////*/
#top_trainer{
background: #F5F5F5;
padding: 40px 0;
text-align: center;
}
#top_trainer .top_links{
display: none;
}
#top_trainer h3{
font-size: clamp(20px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.10em;
padding-bottom: 0.25em;
}
#top_trainer h3 br{
display: none;
}
#top_trainer p{
font-size: 80%;
letter-spacing: 0.15em;
font-weight: 300;
}
#top_trainer p br{
display: none;
}
.top_trainer_wrap{
display: flex;
justify-content: center;
width: 90%;
max-width: 1000px;
margin: 40px auto;
}
.trainer_pic{
width: 20%;
}
.top_intlink_wrap{
display: flex;
justify-content: space-between;
width: 90%;
max-width: 1000px;
margin: auto;
}
.top_intlink{
width: 49%;
aspect-ratio: 5 / 2.6;
color: #fff;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
letter-spacing: 0.15em;
position: relative;
}
.top_intlink h4{
font-size: 130%;
line-height: 1.8;
font-weight: 400;
    display: grid;
    align-self: end;
}
.top_intlink a{
position: relative;
color: #fff;
display: block;
width: 100%;
height: 100%;
display: grid;
align-items: center;
z-index: 3;
}
.top_intlink.camp{
background: url("https://gigaplus.makeshop.jp/drofficial/img2026/top2026/camp_pic.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
.top_intlink.partner{
background: url("https://gigaplus.makeshop.jp/drofficial/img2026/top2026/partner_pic.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}
.top_intlink.camp .bg_cover{
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
background: #193050;
opacity: 0.65;
top: 0;
}
.top_intlink.partner .bg_cover{
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
background: #177C84;
opacity: 0.65;
top: 0;
}
#top_trainer .top_intlink p{
position: relative;
width: fit-content;
margin: auto;
}
#top_trainer .top_intlink p:after {
content: '';
width: 8px;
height: 8px;
border: 0;
border-top: solid 1px #fff;
border-right: solid 1px #fff;
transform: rotate(45deg);
position: absolute;
top: 0;
right: -1em;
bottom: -0.1em;
margin: auto;
}
.top_faq_btn{
width: 90%;
max-width: 1000px;
margin: 40px auto;
background: url("https://gigaplus.makeshop.jp/drofficial/img2026/top2026/faq_btn_bg.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
position: relative;
align-content: center;
font-size: 115%;
font-weight: 400;
}
.top_faq_btn h4{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
letter-spacing: 0.15em;
font-weight: 300;
font-size: 105%;
background: #000;
padding: 0.25em 0;
border-radius: 50px;
width: 12em;
text-align: center;
margin: auto;
}
.top_faq_btn a{
position: relative;
display: grid;
grid-template-columns: 40% 60%;
align-items: center;
z-index: 3;
color: #fff;
padding: 25px 0;
}
.top_faq_btn .bg_cover{
position: absolute;
width: 100%;
height: 100%;
z-index: 1;
background: #000;
opacity: 0.65;
top: 0;
}
#top_trainer .top_faq_btn p br{
display: none;
}

@media screen and (max-width:800px){
.top_intlink h4{
font-size: 115%;
line-height: 1.8;
font-weight: 400;
display: grid;
align-self: end;
}
}
@media screen and (max-width:710px){

#top_trainer p br{
display: block;
}
#top_trainer .top_intlink p{
display: block;
}
#top_trainer .top_faq_btn p {
display: block;
}
#top_trainer_sp{
text-align: center;
padding: 50px 0 0;
}
#top_trainer h3{
font-size: clamp(28px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.10em;
padding-bottom: 0.25em;
}
#top_trainer p{
font-size: 100%;
letter-spacing: 0.15em;
font-weight: 300;
position: relative;
}
.top_trainer_wrap {
flex-wrap: wrap;
}
.trainer_pic{
width: 30%;
}
.top_intlink_wrap{
display: block;
justify-content: center;
width: 90%;
max-width: 1000px;
margin: auto;
}
.top_intlink{
width: 100%;
max-width: 500px;
margin: auto;
margin-bottom: 20px;
aspect-ratio: 5 / 2.6;
color: #fff;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
letter-spacing: 0.15em;
position: relative;
}
.top_faq_btn{
aspect-ratio: 5 / 1.5;
width: 90%;
max-width: 500px;
margin: 0 auto 20px;
}
.top_faq_btn a{
position: relative;
display: grid;
grid-template-columns: 1fr;
padding: 10px 0;
}
.top_faq_btn h4{
font-size: 95%;
margin-bottom: 10px;
}
#top_trainer .top_faq_btn p {
    font-size: 87.5%;
}
#top_trainer .top_links{
display: block;
margin-bottom: 30px;
}
#top_trainer .top_links ul{
border-top: solid 1px #aaaaaa;
}
#top_trainer .top_links li{
display: grid;
position: relative;
text-align: left;
padding: 0 1em;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
letter-spacing: 0.15em;
height: 5em;
align-items: center;
border-bottom: solid 1px #aaaaaa;
}
#top_trainer .top_links li a:before {
  content: '';
  width: 28px;
  height: 28px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: 0;
  right: 1em;
  bottom: 0;
  margin: auto;
}
#top_trainer .top_links li a:after {
  content: '';
  width: 6px;
  height: 6px;
  border: 0;
  border-top: solid 1px #F27B84;
  border-right: solid 1px #F27B84;
  transform: rotate(45deg);
  position: absolute;
  top: 0;
  right: 1.7em;
  bottom: 0;
  margin: auto;
}
}
@media screen and (max-width:600px){
#top_trainer h3 br{
display: block;
}
#top_trainer .top_faq_btn p br{
display: block;
}
}


/*//// VOICE ////*/

/* ===== VOICE�ｽ蝠C�ｽ�ｽ711px闔会ｽ･闕ｳ螂�ｽｼ蟲ｨ�ｽ闔臥ｿｫ竏ｪ邵ｺ�ｧ鬨ｾ螢ｹ�� ===== */
.itemSelect--voice{
  width: min(1200px, 100%);
  margin: 2em auto;
}

#top_voice{
padding: 60px 0;
}

#top_voice h3{
font-size: clamp(20px, 2.6vw, 38px);
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
letter-spacing: 0.10em;
text-align: center;
position: relative;
margin-bottom: 60px;
}
#top_voice h3::after{
content: "";
position: absolute;
left: 0;
right: 0;
margin: auto;
bottom: -0.75em;
width: 1.05em;
border-bottom: solid 5px #D11120;
}
.top_voice_wrap{
width: 90%;
max-width: 1200px;
margin: auto;
display:flex;
justify-content: space-between;
align-items:stretch;
--step: clamp(12px, 2.2vw, 36px);
}
.voice_card{
width: 24%;
background: #F5F5F5;
font-weight: 400;
}
.top_voice_wrap > .voice_card:nth-child(even){
transform: translateY(var(--step));
}
.voice_card p.voice_no{
text-align: center;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
letter-spacing: 0.05em;
font-weight: 300;
font-size: 280%;
line-height: 1;
color: #D11120;
}
.voice_card p.voice_no span{
font-size: 30%;
}
.voice_card h5{
text-align: center;
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
letter-spacing: 0.15em;
font-weight: 300;
font-size: 100%;
line-height: 1.4;
padding: 0.65em 0;
}
.voice_card_txt{
padding: 15px;
font-size: 87.5%;
text-align: justify;
line-height: 1.7;
}
.voice_card_pic{
width: 100%;
aspect-ratio: 2 / 1;
overflow: hidden;
}
.voice_card_pic img{
width: 100%;
height: 100%;
object-fit: cover;
}


/* PC邵ｺ�ｧ邵ｺ�ｯ郢ｧ�ｹ郢ｧ�ｯ郢晢ｽｭ郢晢ｽｼ郢晢ｽｫ隶匁ｻ難ｽｧ荵晢ｽ定ｾ滂ｽ｡陷会ｽｹ陋ｹ謔ｶ��邵ｺ�ｦ遯ｶ諛亥矯鬨ｾ螢ｹ�ｽ4郢ｧ�ｫ郢晢ｽｩ郢晢ｿｽ遯ｶ譏ｴ竊� */
@media (min-width: 921px){
  .itemSelect--voice .itemSelect__viewport{
    overflow: visible;
  }
  .itemSelect--voice .itemSelect__arrow{
    display: none !important;
  }

  .itemSelect--voice .itemSelect__list{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 0;
    padding: 0;            /* itemSelect__list邵ｺ�ｮ陝ｾ�ｦ陷ｿ�ｳpadding郢ｧ螳夲ｽｧ�｣鬮ｯ�､ */
  }

  .itemSelect--voice .voice_card{
    width: 24%;
    flex: 0 0 auto;
    background: #F5F5F5;
    font-weight: 400;
  }

  /* 闔�蛛ｵ�樣ｩ戊ｼ費ｼ橸ｿｽ�ｽPC邵ｺ�ｮ邵ｺ�ｿ�ｽ�ｽ */
  .itemSelect--voice .voice_card:nth-child(even){
transform: translateY(var(--step));
}
}

/* ===== VOICE�ｽ蜚ｮP�ｽ�ｽ920px闔会ｽ･闕ｳ蜈ｷ�ｼ蟲ｨ�ｽ隶難ｽｪ郢ｧ�ｹ郢ｧ�ｯ郢晢ｽｭ郢晢ｽｼ郢晢ｽｫ�ｽ蛹ｺ�ｮ�ｵ陝ｾ�ｮ邵ｺ�ｪ邵ｺ�ｽ ===== */
@media (max-width:920px){
.itemSelect--voice{
width: 90%;
margin: 2em auto;
}
  .itemSelect--voice .itemSelect__arrow--prev {
    left: -20px;
}
  .itemSelect--voice .itemSelect__arrow--next {
    right: -20px;
}
/* SP邵ｺ�ｧ邵ｺ�ｯ itemSelect 邵ｺ�ｮ隶灘綜�ｺ蛹∝ｫ瑚恪蛹�ｽｼ�ｽoverflow + 驕擾ｽ｢陷奇ｽｰ�ｽ蟲ｨ�定ｱ｢�ｻ邵ｺ荵昶� */
.itemSelect--voice .itemSelect__list{
justify-content: flex-start;
gap: 12px;
padding: 0 0 0 0;
}

.itemSelect--voice .voice_card{
width: min(78vw, 300px);
flex: 0 0 auto;
}

.itemSelect--voice .voice_card:nth-child(even){
transform: none;
}

}

@media (max-width: 710px){

.itemSelect--voice .voice_card{
flex: 0 0 auto;
width: calc((100%  - 12px) / 2);
}
}

@media (max-width: 600px){
.itemSelect--voice .voice_card{
width: 90%;
}
}


/*//// MEMBER LOGIN ////*/

.login_btn{
text-align: center;
width:90%;
margin:40px auto 50px;
display: flex;
justify-content: center;
}
.login_btn a{
width: 48%;
max-width: 380px;
margin: 0 1%;
}

@media screen and (max-width:710px){
.login_btn{
width: 80%;
max-width: 370px;
flex-wrap: wrap;
}
.login_btn a{
width: 100%;
margin: 0 0 20px;
}
}