@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP:100,300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,600;1,600&family=Noto+Sans+JP:wght@100..900&display=swap');


/* ==============================================
setting
============================================== */

* {
margin:0;
padding:0;
}
#nextbreak body{
overflow-x: hidden;
background: #fff;
}
#nextbreak h1,#nextbreak h2,#nextbreak h3,#nextbreak h4,#nextbreak h5,#nextbreak p,#nextbreak th,#nextbreak td,#nextbreak dt,#nextbreak dd,#nextbreak li,#nextbreak input,#nextbreak select,#nextbreak a {
font-family:"Roboto","Noto Sans JP","ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
font-size: 15px;
line-height: 28px;
letter-spacing: 0.5px;
margin:0;
padding:0;
color:#414141;
}
#nextbreak h1,#nextbreak h2,#nextbreak h3,#nextbreak h4,#nextbreak h5,#nextbreak div,#nextbreak table,#nextbreak th,#nextbreak td,#nextbreak dl,#nextbreak dt,#nextbreak dd,#nextbreak ul,#nextbreak li,#nextbreak p,#nextbreak a,#nextbreak strong,#nextbreak span,#nextbreak input,#nextbreak select {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
img {
width: 100%;
height: auto;
border:none;
vertical-align:middle;
}
table {
border-collapse:collapse;
border-spacing:0;
}
ul {
list-style:none;
}
sup {
font-size: 10px;
text-align: text-top;
}
ul:after { content:"."; clear:both; height:0; display:block; visibility:hidden; }
ul:after { content:"."; clear:both; height:0; display:block; visibility:hidden; }
* html ul { display:inline-block; }
*:first-child+html ul { display:inline-block; }

a:link {color:#222222; text-decoration:none;}
a:visited {color:#222222; text-decoration:none;}
a:active {color:#222222; text-decoration:none;}
a{
-webkit-transition: 0.2s ease-out;
transition: 0.2s ease-out;
}
a:hover{
opacity: 0.7;
}


@media screen and (max-width:767px) {
.pc{
display:none!important;
}
}
@media screen and (min-width:768px){
.sp{
display:none!important;
}
}

/* ==============================================
#nextbreak
============================================== */
#nextbreak{
background:url("../images/nb_bg.png");
background-size: 100%;
position: relative;
max-width:720px;
z-index:0;
font-size: 62.5%;
}

#nextbreak #introduction{
position: relative;
width: 100%;
margin: 0 auto;
}
#nextbreak #introduction .main_bg{
position: relative;
padding:0 0 10% 0;
filter: drop-shadow(10px 10px 10px rgba(225, 225, 225, 0.7));
}

#nextbreak #introduction .main_bg::before{
content: '';
position:absolute;
width:72%;
height:65%;
border-radius: 100%;
top:10%;
left: 0;
right: 0;
margin: 0 auto;
background-color: #fff;
filter: blur(20px);
transform:scale(1.2);
mix-blend-mode: color-burn;
z-index: -1;
animation: glow 2s infinite ease-in;
}
@keyframes glow {
  0%,100% {
/*filter: blur(10px);*/
transform:scale(1.2);
    mix-blend-mode: hard-light;
  }
  50% {
/*filter: blur(25px);*/
transform:scale(1.4);
    mix-blend-mode: hard-light;
  }
}
#nextbreak #introduction .chara{
position: absolute;
top:10%;
}
#nextbreak #introduction h1{
position: absolute;
width:90%;
margin: 0 auto;
left: 0;
right: 0;
top:35%;
filter: drop-shadow(0px 5px 5px rgba(225, 00, 225, 0.7));
}
#nextbreak #introduction .tamahiyo_logo{
position: absolute;
top:20%;
}
#nextbreak #introduction .sub{
position: absolute;
bottom:-10px;
}
#nextbreak #introduction .year{
position: absolute;
width:28%;
margin: 0 auto;
left: 0;
right: 0;
bottom:-40%;
}
#nextbreak::after{
content: "";
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
background: url("../images/nb_bg_tex.png");
background-size: 50% auto;
z-index:-2;
opacity: 0.05;
}


/* ==============================================
about
============================================== */
#nextbreak .about .about_button{
background: #fff;
padding:15px 0;
width: 90%;
margin: 0 auto;
border-radius: 10px;
background:#fff url("../images/nb_ab_bt_icpl.png")no-repeat;
background-size:20px 20px;
background-position:98% 50%;
filter: drop-shadow(0px 5px 5px rgba(000, 000, 000, 0.2));
}
#nextbreak .about .about_button.open{
background:#fff url("../images/nb_ab_bt_icmn.png")no-repeat;
background-size:20px 20px;
background-position:98% 50%;
}
#nextbreak .about .about_button img{
width:90%;
padding:0 0 0 20px;
}
#nextbreak .about .accordion{
background: #fff;
width: 90%;
padding:20px 5% 20px 5%;
margin:10px auto;
border-radius:10px;
position: relative;
}


#nextbreak .about h3{
font-size: 1.5rem;
line-height: 2.4rem;
letter-spacing:-0.1rem;
font-weight: 800;
padding:0 0 10px 0;
text-align: center;
background: linear-gradient(90deg, #54ffab 0%, #00c2ff 40%, #ff67aa 100%);
color: transparent;
-webkit-background-clip: text;
background-clip: text;
-webkit-text-fill-color: transparent;
text-fill-color: transparent;
}
#nextbreak .about p{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 400;
letter-spacing:-0.08rem;
margin: 0 5%;
padding:10px 0 0 0;
}
#nextbreak .about .abt_cont{
display:flex!important;
flex-wrap: wrap;
padding:20px 0 0 0;
}
#nextbreak .about .abt_cont p{
width: 50%;
padding: 0;
margin: 0;
}

/* ==============================================
outline
============================================== */
#nextbreak #outline{
margin-top:-80px;
padding:80px 0 20px 0;
}
#nextbreak #outline .box{
margin:20px 3% 0 3%;
padding:20px 0 20px 0;
background:#fff;
border-radius: 40px;
position: relative;
filter: drop-shadow(0px 5px 5px rgba(000, 000, 000, 0.2));
}
#nextbreak #outline .box h2{
margin:3px 5% 3px 5%;
padding:10px 0 0px 16px;
position: relative;
}

#nextbreak #outline .box h3{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 800;
font-style:"Roboto","Noto Sans JP";
color: #fff;
margin:0 5% 10px 5%;
padding:8px 0 8px 0;
background:#dacc87;
border-radius:20px;
text-align:center;
}
#nextbreak #outline .box div a{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 800;
display: block;
margin:0 8%;
padding:8px 0;
background: url("../images/nb_ol_ttl_tp_aro.png")no-repeat;
background-position:100% 50%;
background-size:16px;
text-indent: 16px;
position: relative;
font-family:"Roboto","Noto Sans JP";
border-bottom: solid 1px #e3e3e3;
}
#nextbreak #outline .box .parents a{
background: url("../images/nb_ol_ttl_pm_aro.png")no-repeat;
background-position:100% 50%;
background-size:16px;
text-indent: 16px;
position: relative;
}
#nextbreak #outline .box h2 a::before{
content: '';
position: absolute;
width: 5px;
height: 24px;
background:#d2a76f;
top:0;
left: 0;
}
#nextbreak .floating_button{
bottom:-100px;
right:0;
width:50%;
max-width:200px;
z-index:100;
position: fixed;
}
#nextbreak .floating_button.on{
bottom:10px;
right:0px;
width:50%;
max-width:200px;
z-index:100;
position: fixed;
}



/* ==============================================
ranking
============================================== */
#nextbreak .taipa h2{
padding:40px 0 20px 0;
}
#nextbreak .health h2{
padding:40px 0 20px 0;
}

#nextbreak .container{
background: rgba(255, 255, 255, 0.6);
border-radius: 10px;
margin:0 3%;
padding:10px　5% 5px 5%;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}


/* grand_prize */

#nextbreak .grand_prize h3{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
margin: 0 auto;
padding:15px 0 45px 0;
text-align: center;
}
#nextbreak .grand_prize figure{
width:90%;
margin: 0 auto;
position: relative;
}
#nextbreak .grand_prize figure img{
border-radius: 10px;
}
#nextbreak .grand_prize .badge{
width:33%;
position: absolute;
top:-60px;
left:-40px;
filter: drop-shadow(0px 4px 5px rgba(0,0,0,0.2));
}
#nextbreak .grand_prize h4{
font-size:1.8rem;
line-height: 2.6rem;
font-weight: 800;
margin:20px 5% 0 5%;
}
#nextbreak .grand_prize h4 span{
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 600;
}

#nextbreak .grand_prize p{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 400;
margin:0 5%;
padding: 10px 0 0 0;
}
#nextbreak .grand_prize .price{
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 400;
margin:0 5%;
padding:0 0 0 0;
}

#nextbreak .taipa .grand_prize p span{
font-weight: 600;
background: linear-gradient(transparent 50%, #aff8da 50%);
}
#nextbreak .health .grand_prize p span{
font-weight: 600;
background: linear-gradient(transparent 50%, #ffc0d8 50%);
}
#nextbreak .grand_prize .tamahiyo_coment{
background: rgba(255, 255, 255, 0.8);
margin:30px 5%;
padding: 10px 0;
position: relative;
border-radius: 10px;
}

#nextbreak .taipa .grand_prize .tamahiyo_coment::after{
content: 'ここがスゴイ！';
background:#7fe1b9;
width:120px;
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 800;
display: block;
text-align: center;
font-family:"Roboto","Noto Sans JP";
color: #fff;
padding:3px 0 3px 0;
border-radius: 30px;
position: absolute;
top:-10px;
left:-10px;
}
#nextbreak .taipa .grand_prize .tamahiyo_coment::before{
content: '';
background:#7fe1b9;
width:15px;
height:15px;
display: block;
position: absolute;
top:10px;
left:40px;
clip-path: polygon(100% 0, 0 0, 72% 100%);
}
#nextbreak .health .grand_prize .tamahiyo_coment::after{
content: 'ここがスゴイ！';
background:#ff5c7c;
width:120px;
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 800;
display: block;
text-align: center;
font-family:"Roboto","Noto Sans JP";
color: #fff;
padding:3px 0 3px 0;
border-radius: 30px;
position: absolute;
top:-10px;
left:-10px;
}
#nextbreak .health .grand_prize .tamahiyo_coment::before{
content: '';
background:#ff5c7c;
width:15px;
height:15px;
display: block;
position: absolute;
top:10px;
left:40px;
clip-path: polygon(100% 0, 0 0, 72% 100%);
}
#nextbreak .grand_prize .tamahiyo_coment h5 span{
color: #ff3bae;
font-weight: 800;
}
#nextbreak .grand_prize .tamahiyo_coment h5{
font-size:1.4rem;
line-height: 2.4rem;
letter-spacing:0.2rem; 
font-weight: 600;
text-align: center;
margin:10px 0 0 0;
}
#nextbreak .taipa .button_main a{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
padding:8px 0;
margin:10px 5% 0 5%;
background: #4ebeff;
color:#fff;
display: block;
text-align: center;
border-radius: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}
#nextbreak .health .button_main a{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
padding:8px 0;
margin:10px 5% 0 5%;
background: #ffb44a;
color:#fff;
display: block;
text-align: center;
border-radius: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}
#nextbreak .ec_button{
display: flex;
margin: 0 5%;
}
#nextbreak .button_amazon a{
font-size:1.2rem;
line-height: 2.4rem;
font-weight: 600;
padding:8px 0;
margin:0 3px 0 0;
background: #202155;
color:#fff;
display: block;
text-align: center;
border-radius: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}
#nextbreak .button_amazon,#nextbreak .button_rakuten{
width: 50%;
padding:8px 0 0 0;
}
#nextbreak .button_amazon_full a{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
padding:8px 0;
margin:10px 5% 0 5%;
background: #202155;
color:#fff;
display: block;
text-align: center;
border-radius: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}
#nextbreak .button_rakuten a{
font-size:1.2rem;
line-height: 2.4rem;
font-weight: 600;
padding:8px 0;
margin:0 0 0 3px;
background: #d30037;
color:#fff;
display: block;
text-align: center;
border-radius: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}
#nextbreak .button_rakuten_full a{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
padding:8px 0;
margin:10px 5% 0 5%;
background: #d30037;
color:#fff;
display: block;
text-align: center;
border-radius: 30px;
box-shadow: 0px 2px 4px rgba(0,0,0,0.2);
}
#nextbreak h3{
position: relative;
margin:20px auto 0;
text-align: center;
}


/*slick*/

#nextbreak .nominate_slider_wrap{
position: relative;
margin: 0 0 30px 0;
}

#nextbreak .nominate{
border-radius: 10px;
margin:20px auto;
width:90%;
}
#nextbreak .nominate figure{
width:100%;
margin: 0 auto;
position: relative;
}
#nextbreak .nominate figure img{
border-radius: 10px;
}

#nextbreak .nominate_slider_thumb .slick-track{
transform:unset!important;
}
#nextbreak .taipa .nominate_slider_thumb .slick-current.slick-active{
outline: solid 1.2vw rgba(209, 253, 254, 1);
outline-offset:-1.2vw;
opacity:1;
}
#nextbreak .nominate_slider_thumb .thum_card{
outline: solid 1.2vw #e0e0e0;
outline-offset:-1.2vw;
}
#nextbreak .health .nominate_slider_thumb .slick-current.slick-active{
outline: solid 1.2vw rgba(251, 255, 196, 1);
outline-offset:-1.2vw;
opacity:1;
}
 @media screen and (min-width:768px){
#nextbreak .taipa .nominate_slider_thumb .slick-current.slick-active{
outline: solid 6px rgba(209, 253, 254, 1);
outline-offset:-6px;
opacity:1;
}
#nextbreak .nominate_slider_thumb .thum_card{
outline: solid 6px #e0e0e0;
outline-offset:-6px;
}
#nextbreak .health .nominate_slider_thumb .slick-current.slick-active{
outline: solid 6px rgba(251, 255, 196, 1);
outline-offset:-6px;
opacity:1;
}
}
#nextbreak .nominate_slider_thumb .thum_card p{
font-size:1.0rem;
line-height:1.2rem;
height: 3.2rem;
font-weight: 600;
padding:1.0rem 0 0 0;
background:#fff;
text-align: center;
}
#nextbreak .nominate_slider_thumb .thum_card img{
padding:0 8% 10px 8%;
margin:0 auto;
background:#fff;
}
#nextbreak .detail a{
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 600;
color: #444444;
border-radius: 30px;
border: 1px solid #444444;
display: block;
margin: 10px 0 5px 0;
padding: 5px 0;
text-align: center;
font-family:"Roboto","Noto Sans JP";
}
#nextbreak .taipa .merch_cards{
background-image: linear-gradient(20deg, rgba(233, 255, 227, 1), rgba(209, 253, 254, 1));
padding:0 0 20px 0;
border-radius:0 0 10px 10px;
margin:0 0 20px 0;
}
#nextbreak .health .merch_cards{
background-image: linear-gradient(20deg, rgba(255, 228, 244, 1), rgba(251, 255, 196, 1));
padding:0 0 20px 0;
border-radius:0 0 10px 10px;
margin:0 0 20px 0;
}
#nextbreak .merch_cards figure{
padding:20px 15% 0 15%;
}
#nextbreak .merch_cards figure.wide{
padding:20px 8% 0 8%;
border-radius:10px 10px 0 0;
}

#nextbreak .merch_cards h4{
font-size:1.6rem;
line-height: 2.4rem;
font-weight: 800;
margin:20px 5% 0 5%;
}
#nextbreak .merch_cards h4 span{
font-size:1.2rem;
line-height:1.8rem;
font-weight: 600;
display:inline-block;
}

#nextbreak .merch_cards p{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 400;
margin: 0 5%;
padding:10px 0 0 0;
}
#nextbreak .merch_cards p span{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
}
#nextbreak .merch_cards .price{
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 400;
padding:0 0 0 0;
}




#nextbreak .merch_dital{
background: #fff;
display: block;
}


#nextbreak .ac_button.open .accordion{
display:block!important;
}
#nextbreak .ac_button.open .maternity_outline{
display:block!important;
}
#nextbreak .ac_button a{
padding:8px 0 8px 0;
margin: 0 5%;
border-radius:10px;
background: #ff9494 url("../images/gdlk_btn_menul_icon.png")no-repeat;
background-size:16px 16px;
background-position:98% center;
color: #fff;
display: block;
text-align: center;
font-size: 14px;
line-height: 24px;
font-weight: 600;
}


#nextbreak #overview{
margin:40px 0 20px 0;
padding:0 0 20px 0;
background: #FFF;
}
#nextbreak #overview h3{
background:#d2a76f;
color: #fff;
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 600;
padding:10px;
text-align: center;
margin:20px 0 20px 0;
}
#nextbreak #overview p{
font-size:1.4rem;
line-height: 2.4rem;
font-weight: 400;
padding:10px 5% 0 5%;
text-align: left;
}
#nextbreak #overview ul li{
font-size:1.2rem;
line-height: 2.2rem;
font-weight: 400;
padding:3px 5% 0 5%;
text-align: left;
}
#nextbreak #overview .note{
font-size:1.2rem;
line-height: 2.0rem;
font-weight: 400;
padding:3px 5%;
text-align: left;
}

#nextbreak .product .sup_top{
font-size: 10px;
vertical-align: super;
}
@media screen and (min-width:768px){
#nextbreak .product sup{
font-size: 10px;
vertical-align: bottom;
}
}


/*pc*/

 @media screen and (min-width:768px){
/*
#nextbreak .bg{
position:fixed;
top: 0;
left: 0;
margin: 0;
overflow: hidden;
z-index:-10;
}
#nextbreak .bg::after{
content: "";
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
background: url("../images/nb_bg_tex.png");
background-size: 30% auto;
z-index: 100;
opacity: 0.05;
}
#nextbreak .bg img{
width: 100vw;
height: 100vh;
object-fit: cover;
}
*/

#nextbreak #introduction{
position: relative;
max-width:500px;
margin: 0 auto;
}
     
#nextbreak #outline{    
max-width: 600px;
margin: 0 auto;    
}    
#nextbreak #outline{    
max-width: 600px;
margin: 0 auto;    
}   
     
#nextbreak .taipa,#nextbreak .health{
max-width:600px;
margin: 0 auto;         
}
#nextbreak .grand_prize .badge{
width:30%;
position: absolute;
top:-80px;
left:-40px;
filter: drop-shadow(0px 6px 4px rgba(0,0,0,0.4));
}    

     
     
     
     
     
     
     
     
     
     
     
     
     
 }