@charset "UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

body {
    /*line-height: 1;*/
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

nav ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
    content: '';
    content: none;
}

a {
    margin: 0;
    padding: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}

/* change colours to suit your needs */
ins {
    background-color: #ff9;
    color: #000;
    text-decoration: none;
}

/* change colours to suit your needs */
mark {
    background-color: #ff9;
    color: #000;
    font-style: italic;
    font-weight: bold;
}

del {
    text-decoration: line-through;
}

abbr[title], dfn[title] {
    border-bottom: 1px dotted;
    cursor: help;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #cccccc;
    margin: 1em 0;
    padding: 0;
}

input, select {
    vertical-align: middle;
}

li {
    list-style: none;
}
html{
    /*overscroll-behavior: none;*/
}
body {
    font-family: 'ヒラギノ角ゴシック', 'Hiragino Sans', YuGothic, 'Yu Gothic', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
    background-size: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%;
    background: #E3E2E3;
}

a{
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
.border-box{
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    height: 100vh;
    outline:#7E7E86 solid 1px;
    outline-offset: -2px;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    z-index:100;

}
.news_top {
    background: #E3E2E3;
    width: 100%;
    margin: 0 auto;
    /*outline:#7E7E86 solid 1px;
    outline-offset: -2px;*/
    padding-top: 15px;
    padding-bottom: 15px;
    height: 100vh;
    /*overflow: scroll;*/


}

.news_top .news_wrapper {
    width: 94.6%;
    margin: 0 auto;
}

.news_top .news_wrapper .bannerarea {
    width: 100%;
    margin: 0 auto;
}

.news_top .news_wrapper .bannerarea .slide_bnr button {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.slick-slide img {
    width: 100%;
}

.news_top .news_wrapper .bannerarea .slide_bnr .slide-dots {
    text-align: center;
}

.news_top .news_wrapper .bannerarea .slide_bnr .slide-dots li {
    display: inline-block;
    margin: 5px 15px 0;
}

.news_top .news_wrapper .bannerarea .slide_bnr .slide-dots li button {
    position: relative;
    text-indent: -9999px;
}

.news_top .news_wrapper .bannerarea .slide_bnr .slide-dots li button:before {
    content: '';
    width: 16px;
    height: 16px;
    background-image: url("/news/assets/img/icon_carousel.png");
    font-size: 20px;
    text-indent: 0px;
    position: absolute;
    top: 0;
    left: 0;
}

.news_top .news_wrapper .bannerarea .slide_bnr .slide-dots li.slick-active button:before {
    content: '';
    width: 16px;
    height: 16px;
    background-image: url("/news/assets/img/icon_carousel-active.png");
}

.news_top .news_wrapper .news_list {

    margin-top: 20px;

}

.news_top .news_wrapper .news_list ul {
    width: 100%;
    margin: 0 auto ;

}

.news_top .news_wrapper .news_list ul li {
    margin-bottom: 25px;
    position: relative;
    width: 100%;
    height: calc(111 / 1190 * 100vw);
    background-image: url("/news/assets/img/button_foundation_normal_panel_small.png");
    background-repeat: no-repeat;
    background-size: 100%;
}

.news_top .news_wrapper .news_list ul li:nth-child(n+6) {
    /*display: none;*/
}

.news_top .news_wrapper .news_list ul li::after {
    content: "";
    background-image: url("/news/assets/img/button_arrow.png");
    background-repeat: no-repeat;
    background-size: 100%;
    height: calc(48 / 1190 * 100vw);
    width: calc(41 / 1190 * 100vw);
    position: absolute;
    right: 2%;
    top: calc(32 / 1190 * 100vw);
pointer-events: none;
}

.news_top .news_wrapper .news_list ul li a {
    display: block;
    width: 100%;
    height:  calc(111 / 1190 * 100vw);
    text-decoration: none;
}

.news_top .news_wrapper .news_list ul li a .news_cat {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-image: url("/news/assets/img/foundation_category-title.png");
    background-repeat: no-repeat;
    background-size: 100%;
    width: 25%;
    height: calc(30 / 1190 * 100vw);
    position: absolute;
    left: 2%;
    top: calc(17 / 1190 * 100vw);
    color: #FFF;
    line-height: calc(27 / 1190 * 100vw);
    padding-left: 17px;
    font-size: calc(20 / 1190 * 100vw);

}

.news_top .news_wrapper .news_list ul li a .news_date {
    position: absolute;
    left: 2%;
    top: calc(52 / 1190 * 100vw);
    color: #372E29;
   font-size:  calc(25 / 1190 * 100vw);
    font-weight: bold;
}

.news_top .news_wrapper .news_list ul li a .news_title {
    /*display: -webkit-box;*/
    /*display: -ms-flexbox;*/
    /*display: flex;*/
    /*align-items: center;*/
    width: 60%;
    height: calc(80 / 1190 * 100vw);
    position: absolute;
    left: 28%;
    padding-left: 4%;
    top: calc(20 / 1190 * 100vw);
    color: #191B2A;
    font-size: calc(28 / 1190 * 100vw);
    line-height: 1.2em;
}
.news_top .news_wrapper .news_list ul li a .news_title .title_innner{

    height: calc(61 / 1190 * 100vw);
}

.news_top .news_wrapper .news_list ul li a .news_title::after {
    content: "";
    background-image: url("/news/assets/img/decoration_line_rhombus.png");
    background-repeat: no-repeat;
    background-size: 100%;
    height: calc(16 / 1190 * 100vw);
    width: 100%;
    display: block;

}

.news_top .news_wrapper::-webkit-scrollbar {
    width: 6px;
}

.news_top .news_wrapper::-webkit-scrollbar-track {
    background: black;
    border: 4px solid transparent;
    background-clip: content-box;
}

.news_top .news_wrapper::-webkit-scrollbar-thumb {
    background: #191919;
    border: 1px solid black;
    height: 20px;
}

.news_detail {
    position: relative;
    background: #E3E2E3;
    width: 100%;
    height:100vh;
    height: -webkit-fill-available;
    margin: 0 auto;
    /* outline:#7E7E86 solid 1px;
     outline-offset: -2px;*/
    /*overflow-y: auto;*/
    overflow: auto;
    -webkit-overflow-scrolling: touch;

}

.news_detail .news_backbtn {
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-image: url("/news/assets/img/button_left-top_back.png");
    background-size: 100%;
    background-repeat: no-repeat;
    width: 72px;
    height: 48px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 100;
    color: #FFF;
    text-decoration: none;
    font-size: 28px;
    line-height: 84px;
    padding-left: 22px;
}

.news_detail .detail_wrapper {
    width: 95%;
    margin: 0 auto;
}

.news_detail .detail_wrapper .detail_header {
    margin-bottom: 10px;
    position: relative;
    width: 100%;
    background-repeat: no-repeat;
    padding-bottom: 20px;
}

.news_detail .detail_wrapper .detail_header::after {
    content: "";
    background-image: url("/news/assets/img/decoration_line_rhombus_detail.png");
    background-repeat: no-repeat;
    background-size: 100%;
    height: 16px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
}

.news_detail .detail_wrapper .detail_header .news_cat {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-image: url("/news/assets/img/foundation_category-title.png");
    background-repeat: no-repeat;
    background-size: 100%;
    width: 26%;
    height: 15px;
    position: absolute;
    left: 7%;
    top: 7px;
    color: #FFF;
    line-height: 15px;
    padding-left: 15px;
    font-size: 12px;
}

.news_detail .detail_wrapper .detail_header .news_date {
    position: absolute;
    left:33%;
    top: 8px;
    color: #867758;
    font-size: 14px;
    font-weight: bold;
}

.news_detail .detail_wrapper .detail_header .news_title {
    width: 95%;
    color: #191B2A;
    font-size: 18px;
    padding-top: 29px;
    padding-left: 6%;
    font-weight: normal;
}

.news_detail .detail_wrapper .news_banner {
    position: relative;
    margin: 0 auto 16px;
    width: 85%;
}
/*ガチャ詳細ページのみバナー調整*/
.gacha_info .detail_wrapper .news_banner{
    margin-top: 20px;
}

.news_detail .detail_wrapper .news_banner img {
    width: 100%;
}

.news_detail .detail_wrapper .news_backbtn_bottom {
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    background-image: url("/news/assets/img/button_back.png");
    background-repeat: no-repeat;
    background-size: 100%;
    width: 137px;
    height: 42px;
    line-height: 42px;
    margin: 20px auto;
    color: #FFF;
    text-decoration: none;
    text-align: center;
}

/*detail article=========================*/
.detail_article {

    font-size: 14px;
    color: #191B2A;
    margin: 0 auto;

}

.detail_article h2 {

    width: 100%;
    color: #191B2A;
    font-size: 2em;
    padding-bottom: 30px;
    margin: 50px 0 24px 0;
    font-weight: normal;
    background: url("/news/assets/img/decoration_line_rhombus_detail.png") no-repeat bottom left;


}

.detail_article h3 {

    width: 100%;
    color: #191B2A;
    font-size: 1.5em;
    padding-bottom: 15px;
    margin: 30px 0 16px 0;
    font-weight: normal;
    background: url("/news/assets/img/decoration_line_h3.png") no-repeat bottom left;


}

.detail_article p {

    line-height: 1.5em;
    margin: 20px 0;
}

.detail_article p img{

    text-align: center;
    display: block;
    margin: 0 auto 20px;
    max-width: 100%;
    height: auto;
}

.detail_article .center {
    text-align: center;
}

.detail_article .contents-wrap figcaption {
    font-size: 0.8rem;
}

.detail_article .red {
    color: #ff313b;
}

.detail_article .blue {
    color: #3764f5;
}

.detail_article .green {
    color: #0db218;
}

.detail_article .purple {
    color: #9a34e1;
}

.detail_article .orange {
    color: #ff8b24;
}

.detail_article .tsize-l {

    font-size: 1.1rem;
}

.detail_article .tsize-ll {

    font-size: 1.3rem;
}

.detail_article .marker-red {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #ffa6ab));
    background: linear-gradient(transparent 60%, #ffa6ab 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-red {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #ffa6ab));
    background: linear-gradient(transparent 60%, #ffa6ab 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-red {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #ffa6ab));
    background: linear-gradient(transparent 60%, #ffa6ab 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-blue {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #b2c5ff));
    background: linear-gradient(transparent 60%, #b2c5ff 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-yellow {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #fff373));
    background: linear-gradient(transparent 60%, #fff373 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-orange {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #ffb675));
    background: linear-gradient(transparent 60%, #ffb675 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-green {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #90df96));
    background: linear-gradient(transparent 60%, #90df96 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .marker-purple {

    background: -webkit-gradient(linear, left top, left bottom, color-stop(60%, transparent), color-stop(60%, #dba7ff));
    background: linear-gradient(transparent 60%, #dba7ff 60%);
    font-weight: bold;
    border-radius: 2px;
}

.detail_article .t-bg1 {
    background: #fdf242;
}

.detail_article .t-bg2 {
    background: #b2c5ff;
}

.detail_article ul {
    font-size: 1rem;
    margin: 20px 8px;
}

.detail_article ul li {
    margin: 10px 0px;
    position: relative;
    padding-left: 1em;
    text-indent: -1em;

}

.detail_article ul.list li:before {
    display: inline-block;
    vertical-align: middle;
    content: '';
    width: 0.6em;
    height: 0.6em;
    background: #ccc;
    border-radius: 50%;
    margin-right: 8px;
}

.detail_article ul.checkmark {
    font-size: 1rem;
    margin: 10px 0px;
}

.detail_article ul.checkmark li {
    position: relative;
}

.detail_article ul.checkmark li::before {
    display: inline-block;
    content: '';
    width: 0.6em;
    height: 0.6em;
    border-left: 2px solid #3498db;
    border-bottom: 2px solid #3498db;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    margin-right: 8px;
}


.detail_article table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
    margin-bottom: 20px;
    border-spacing: 0;
}
.detail_article  table th {
    padding: 10px;
    background: #c7dff4;
    border: solid 1px #bbb;
}

.detail_article table td {
    padding: 10px;
    border: solid 1px #bbb;
}

.detail_article  table tr:nth-child(odd) {
    background-color: #eee;
}

.detail_article .box {
    background: #ccc;
    padding: 10px;
    margin: 10px auto 20px;
}

.detail_article .box-frame {
    background: #eee;
    padding: 10px;
    border: 1px solid #ccc;
    margin: 10px auto 20px;
}

.detail_article .notes{

    color: #867758;
    padding-left: 1em;
    text-indent: -1em;
}

/*ガチャ表示用 位置調整*/
.news_detail .detail_wrapper .detail_header .news_cat.gacha {
    left: 22px;
}

.news_detail .detail_wrapper .detail_header .news_date.gacha {
    left: 324px;
}

.news_detail .detail_wrapper .detail_header .news_title.gacha {
   margin: 0 auto;
    padding-left: 0;
}

.news_detail .detail_wrapper .detail_header.tos {
    margin: 0 auto 10px;
    text-align: center;
}

/* リストNEW表示 */
.badgeNew{
    position: absolute;
    top: -10px;
    left: -5px;
    display: none;
}

.badgeNew img{
width:60%;
}