@charset "UTF-8";
/* CSS Document */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-style:normal;
font-weight: normal;
font-size: 100%;
vertical-align: baseline;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
        box-sizing: border-box;
}
ol, ul{list-style:none;}
img{vertical-align: bottom; width: 100%;}


/*------------------------------------------
【フッター】
--------------------------------------------*/
#footer_wrap{ padding:30px 0; background:#000000; color:#FFFFFF; letter-spacing:0em; border-top:1px solid #666; font-size:12px; margin-bottom: -24px; }
#footer_Box{ width:1000px; margin:0 auto; line-height:1.8em;}
#footer_Box ul{ list-style:none; margin:0; padding:0; display:table; width:100%;}
#footer_Box ul li { padding:0; margin:0; display:table-cell; vertical-align:top;}
#footer_Box ul li a{ color:#FFFFFF; text-decoration:none;}
#footer_Box ul li a:hover{ color:#FFFFFF; text-decoration:underline;}

/* デザインに合わせて変更*/
.copy { color:#fff; font-size:12px; line-height:1.8em; padding:30px 0; text-align: center; }
.link a{ color:#FFFFFF; }

#footer_Box ul .top_box{ border-left:1px #333333 dotted; padding:0 2%; width:31%; position:relative;}
#footer_Box ul .top_box2{ border-left:1px #333333 dotted; padding:0 2%; width:31%; position:relative;}

.top_box .title{ background:#333333; border-radius:3px; padding:5px 10px 3px;}
/*******************/

#footer_Box ul .top_box ul{ margin:10px 0 10px; padding:0; display:table;}
#footer_Box ul .top_box ul li{
	background: url(../img/cmn/listicon.png) left center no-repeat;
	float: left;
	list-style: none;
	padding: 0 15px;
	margin: 0;
	display: table-cell;
	vertical-align: middle;
	/* width: 224px; */
	line-height:1.5em;
}
.top_box2 ul{ padding:0; margin:0 0 20px; width: 100%; display:table;}
.top_box2 ul li{
	float: left;
	list-style: none;
	padding: 0 15px;
	margin: 0;
	display: table-cell;
	vertical-align: middle;
	width: 224px;
}
.top_box2 ul li .note{ position:absolute; top:0; display:block; right:0; font-size:10px;}
.top_box2 ul li .link01{ background: url(../img/cmn/linkicon.png) no-repeat center left; position: absolute; display: block; bottom:25px; right:0; padding-left:20px; }
.top_box2 ul li .link02{ background: url(../img/cmn/linkicon.png) no-repeat center left; position: absolute; display: block; bottom:0; right:0; padding-left:20px; }

/* 下段ロゴ */
#footer_bottom{ margin:20px auto 0;}
#footer_bottom ul{ list-style:none; margin:0; padding:0; display:table; width:100%;}
#footer_bottom ul li { padding:0; margin:0; display:table-cell; vertical-align:bottom;}
#footer_bottom ul .left_Tbnr{ width:10%; text-align:left;}
#footer_bottom ul .center_Tnation{ width:80%; color:#CCC; font-size:10px; line-height:14px; text-align:center; padding:10px 0; margin:10px auto 0; word-break: keep-all;}
#footer_bottom ul .right_Bicon{ width:10%;  text-align:right;}



/* ------ */



/* 全体
==================== */
body{font-family: 'Noto Sans JP', sans-serif;}
#chogokin50th {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    overflow: hidden;
}
#chogokin50th::before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: url(../img/bg_Jx4RNZVk.jpg.jpg) no-repeat center center;
    background-size: cover;
    z-index: -1;  
}

#chogokin50th .dis_sp {display: none;}
#chogokin50th a {
    -webkit-transition: .4s cubic-bezier(.19,1,.22,1);
    -moz-transition: .4s cubic-bezier(.19,1,.22,1);
    -ms-transition: .4s cubic-bezier(.19,1,.22,1);
    -o-transition: .4s cubic-bezier(.19,1,.22,1);
    transition: .4s cubic-bezier(.19,1,.22,1);
}
#chogokin50th a img {
    -webkit-transition: .4s cubic-bezier(.19,1,.22,1);
    -moz-transition: .4s cubic-bezier(.19,1,.22,1);
    -ms-transition: .4s cubic-bezier(.19,1,.22,1);
    -o-transition: .4s cubic-bezier(.19,1,.22,1);
    transition: .4s cubic-bezier(.19,1,.22,1);
}
#chogokin50th a:hover {
    cursor: pointer;
}
#chogokin50th a:hover img {
    transform: translateY(-5px);
    filter: drop-shadow(0px 3px 6px rgba(0,0,0,.75));
}


/* アニメーション
======================== */
.js-fadein {
	opacity: 0;
    transform: translate(0, 0);
	transition : all 1500ms;
}
.js-slidein {
	opacity: 0;
	transform : translate(0, 50px);
	transition : all 1500ms;
}
.fade_active {
	opacity: 1;
	transform: translate(0, 0);
}



/* 1stview
======================== */
#chogokin50th #h1_logo {
    width: 75vw;
    margin: 6vw auto 14vw;
    position: relative;
    box-sizing: border-box;
}
#chogokin50th #h1_logo .h1_logo-text {
    width: 100%;
    text-align: center;
    position: absolute;
    bottom: -7vw;
    font-size: 3.1vw;
    font-weight: bold;
}
#chogokin50th #h1_logo img {
    width: 100%;
    filter: drop-shadow(0px 0px 1vw rgba(0,0,0,.3));
}



/* メインテキスト
======================== */
#chogokin50th #mainTxt {
    /* background: rgba(35,24,21,.6); */
    background: rgba(0,0,0,.5);
    width: 94vw;
    max-width: 1400px;
    margin: 120px auto calc(120px + 20vh);
    padding: 80px 100px;
}
#chogokin50th #mainTxt ._txt {
    font-size: 16px;
    letter-spacing: 0.04em;
    line-height: 2.25;
    margin: 0;
}
#chogokin50th #mainTxt ._txt:not(:first-of-type) {
    margin-top: 25px;
}


/* バナー
======================== */
#chogokin50th #bnrArea {
    width: 94vw;
    max-width: 1400px;
    margin: 120px auto 220px;
}
#chogokin50th #bnrArea ul.bnrList li._txtBnr {
    position: relative;
}
#chogokin50th #bnrArea ul.bnrList > li:not(:first-of-type) {
    margin-top: 60px;
}
#chogokin50th #bnrArea ul.bnrList li._txtBnr span.bnrTxtWrap {
    position: absolute;
    bottom: 32px;
    left: 35px;
    color: #fff;
    font-size: 32px;
    text-shadow: 1px 1px 3px #000;
    line-height: 1.4;
    -webkit-transition: .4s cubic-bezier(.19,1,.22,1);
    -moz-transition: .4s cubic-bezier(.19,1,.22,1);
    -ms-transition: .4s cubic-bezier(.19,1,.22,1);
    -o-transition: .4s cubic-bezier(.19,1,.22,1);
    transition: .4s cubic-bezier(.19,1,.22,1);
}
#chogokin50th #bnrArea ul.bnrList li._txtBnr a:hover span.bnrTxtWrap {
    bottom: 37px;
}
#chogokin50th #bnrArea ul.bnrList li._txtBnr span.bnrTxtWrap span._itemBrand {
    display: block;
    font-size: 0.6em;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-bottom: 0.26em;
}
#chogokin50th #bnrArea ul.bnrList li._txtBnr span.bnrTxtWrap span._itemName {
    display: block;
    font-weight: 700;
    letter-spacing: 0.04em;
}
#chogokin50th #bnrArea ul.bnrList li._txtBnr span.bnrTxtWrap span._itemDate {
    display: block;
    font-size: 0.8em;
    font-weight: 700;
    letter-spacing: 0.04em;
    margin-top: 0.2em;
}


/* 20240125 バナーにロゴを個別に追加
======================== */
#chogokin50th .sl_logo_wrap {
    position: absolute;
    right: 60px;
    bottom: 0;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: center;
    width: 48%;
}
#chogokin50th .sl_logo_wrap._bottom {
    bottom: 15px;
}
#chogokin50th .sl_logo {
    margin-left: 10px;
    margin-bottom: 10px;
}
#chogokin50th .sl_logo img {
    width: auto;
    max-width: 150px;
}