@import url('https://fonts.googleapis.com/css?family=Roboto+Condensed:400,700');
@import url("https://use.typekit.net/rrp7eww.css");
/*共通*/

body {
	background: #ffffff;
	color: #000000;
	font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	width: 100%;
	margin: auto;
	font-size: 100%;
}

ul li,
ol li {
	list-style: none;
}

ul {
    margin-left: 0 !important;
}

a {
	color: #000000;
}

.markdown a {
	color: #0066cc;
}

h1, h2, h3, h4, h5, h6 {
	font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-weight: bold !important;
}

body.template time {
    font-size: 1.1rem;
    font-weight: 400;
}


body.template .content_body header .right a,
body.template header .right > a,
.label.secondary {
    background-color: #ffffff;
    border: #000000 solid 1px;
    color: #000000;
}

body.template .content_body header .right a + i {
    display: none;
}
.tag-item span {
    color: #ffffff;
}

.horizontal-groups-and-tags ul li {
    width: 100%;
}

/*header*/

.global-header {
	background: #000000;
}
.global-header-ghost {
	display: none;
}

.column_widget_menu ul {
	text-align: left;
	margin: 10px 0 15px;
}

.top-bar ul.right li > a,
.column_widget_menu ul li > a {
	font-family:'Roboto Condensed',"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"ＭＳ Ｐゴシック",sans-serif;
	font-size: 1.7rem;
	color: #ffffff;
}

.top-bar ul.right {
	margin:4px 0 0 0 ;
	float: none;
	text-align: center;
	vertical-align: top;
}

.top-bar ul.right li > a:hover,
.column_widget_menu ul li > a:hover {
	color: #cccccc !important;
}

.top-bar .title-area {
	float: none;
	text-align: center;
}

.title-area h1.site_title a {
	background: url(//img.futureartist.net/img/hilcrhyme/hilcrhyme.svg) left top / 100% auto  no-repeat;
	width: 400px !important;
	height: 136px !important;
	text-indent: -9999px;
	display: block;
    margin: 35px auto;
}

.title-area h1.site_title a:hover {
	opacity: 0.8;
}

.top-bar-section ul li {
	float: none;
	display: inline-block;
	vertical-align:middle;
	margin: 0 0.2rem;
}

.global-header-ghost {
	display: none;
}

.top-bar-section {
	text-align: center;
    margin-bottom: 20px;
}

.top-bar-section ul.right {
	float: none !important;
} 


/*main*/

.content-wrap,
.contents{
	background: #ffffff;
	width: 100%;
    padding: 0;
}

body.template .content_body {
	background: #ffffff !important;
    max-width: 1200px;
    width: 100%;
    margin: auto;
    float: none;
    padding:50px 15px;
}


body.template header,
.widget.content header,
.widget.content,
h2.widget_header,
.settings_header .settings_title,
.widget_header .header_title,
.widget_header .widget_title,
.widget_title .widget_title{
	text-align: center;
}

body.template header h2 > a,
.widget.content header h2,
.widget.content h2 a,
h2.widget_header,
.settings_header .settings_title,
.widget_header .header_title,
.widget_header .widget_title,
.widget_header .widget_title a,
.widget_title .widget_title,
.widget_title .widget_title a{
	text-decoration: none;
	font-size: 40px !important;
	font-family: 'Roboto Condensed', sans-serif;
	text-align: center;
	float: none !important;
	font-weight: 400 !important;
    margin-bottom: 20px;
    line-height: 1.2;
}


.f-show.f-video body.template header h2 {
	font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ", Meiryo,"ＭＳ Ｐゴシック",sans-serif;
}

body.template .content_body h3,
body.template .content_body h4 {
     color: #000000;
     font-size: 1.1rem;
     margin-left: 0;
     font-weight: 400;
}

.billboard #down_anchor {
	display: none !important;
}

.item_title a,
.content_body .title:not(.subtitle) {
	font-size: 1.15em;
	font-weight: 400;
	margin-bottom: 10px;
    letter-spacing: 1px;
}

.content_body .label {
	line-height: 1 !important;
	padding: 5px 8px !important;
}

.content_body .no-bullet li,
.widget-item-thumbnail-list .vertical-list-item {
    border-bottom:#4d4d4d solid 1px;
    padding: 1em 0;
	margin-bottom: 0;
	word-wrap : break-word;
}

.content_body .no-bullet li:last-child {
	border: none;
}

.f-home .content_body .no-bullet li:first-child,
.f-home .widget-item-thumbnail-list .vertical-list-item:first-chil {
	padding-top: 0;
}

.widget-item-thumbnail-list .widget-item-list-table .widget-item-list-right.widget-item-list-cell {
	padding-left: 0;
}

body.template .content_body header {
	margin-bottom: 0;
}

body.template .content_body h3.subheader {
	margin-bottom: 0;
}

.content_body .no-bullet li h3 {
	margin-top: 0;
}

button, .button,
button.secondary, .button.secondary{
    background-color: #ffffff;
    border: #000000 solid 1px;
    color: #000000;
	border-radius: 0 !important;
}

button, .button:hover,
button.secondary:hover,
.button.secondary:hover{
    background-color: #000000;
	color: #ffffff;
}

.pagination-centered ul.pagination li.current {
    padding: 0.0625rem 0.625rem 0.0625rem;
}

/*top*/

.f-home .price_plan_form table {
	display: none;
}

.f-home .column_widget_event,
.f-home .column_widget_mediainfo,
.f-home .column_widget_news {
    background: #18181a;
}

.f-home body.template .content_body.widget_event,
.f-home body.template .content_body.widget_mediainfo, 
.f-home body.template .content_body.widget_news {
    background: #18181a !important;
}
.f-home body.template .content_body.widget_event a,
.f-home body.template .content_body.widget_event time,
.f-home body.template .content_body.widget_mediainfo a,
.f-home body.template .content_body.widget_mediainfo time,
.f-home body.template .content_body.widget_news a,
.f-home body.template .content_body.widget_news time{
    color: #ffffff;
}

.f-home body.template .content_body.widget_event a p:hover,
.f-home body.template .content_body.widget_mediainfo a:hover,
.f-home body.template .content_body.widget_news a:hover {
    opacity: 0.5;
}

.f-home .widget_event .label.secondary,
.f-home .widget_mediainfo .label.secondary,
.f-home .widget_news .label.secondary {
    background: #ffffff !important;
    color: #18181a;
    font-size: 1.2rem;
    padding: 5px 10px !important;
}

.f-home .widget_event .button,
.f-home .widget_mediainfo .button,
.f-home .widget_news .button {
    background: #18181a !important;
    border: #ffffff solid 1px;
    font-size: 1.3rem;
    padding: 10px 30px;
}

.f-home .widget_event .button:hover,
.f-home .widget_mediainfo .button:hover,
.f-home .widget_news .button:hover {
	opacity: 0.5;
}

.f-home .widget_event .widget_options,
.f-home .widget_mediainfo .widget_options,
.f-home .widget_news .widget_options {
    text-align: center;
}


/*news*/
.f-news.f-show .markdown,
.f-biography .markdown{
	line-height: 1.3;
	margin-top: 20px;
}

.f-news.f-show .widget_news .markdown,
.f-news.f-show .widget_news .markdown p{
    line-height: 1.6;
}


body.template .content_body.widget_news .label {
    margin:0 0 10px;
}

.f-news.f-show .widget_news .markdown img {
    margin: 15px 0;
}


/*diary / media*/

.content_body.widget_mediainfo .item-date,
.content_body.widget_diary .item-date {
    margin: 10px 5px 0;
}
.content_body.widget_mediainfo .label,
.content_body.widget_diary .label {
    margin: 10px 0 0 !important;
}

.content_body.widget_mediainfo .markdown,
.content_body.widget_diary .markdown {
    margin-top: 25px;
    word-break: break-all;
}

.item_title .item_subtitle {
    display: block !important;
}

.f-diary.f-show .widget_diary .markdown,
.f-mediainfo.f-show .widget_mediainfo .markdown,
.f-diary.f-show .widget_diary .markdown p
.f-mediainfo.f-show .widget_mediainf .markdown p{
    line-height: 1.6;
}

.f-diary.f-show .widget_diary .markdown img,
.f-mediainfo.f-show .widget_mediainfo .markdown img {
    margin: 15px 0;
}


body.template .widget_diary .header-group-list .groups {
    text-align: right;
    padding-bottom: 15px;
}

.f-mediainfo body.template .content_body h3.subheader {
    margin-top: 10px;
}

.f-diary .content_body .widget_options.right,
.f-diary .label.secondary.radius {
	display: none;
}

/*Diary*/
.f-diary.f-wid-64962 .content_body.widget_diary,
.f-diary.f-wid-64963 .content_body.widget_diary,
.f-diary.f-wid-64964 .content_body.widget_diary {
	max-width: 680px;
	padding: 25px;
}

.f-diary.f-wid-64962 .content_body.widget_diary .vertical-list-item,
.f-diary.f-wid-64963 .content_body.widget_diary .vertical-list-item,
.f-diary.f-wid-64964 .content_body.widget_diary .vertical-list-item {
	padding: 1em;
}

/*Report*/
.f-diary.f-wid-64965 .content_body.widget_diary {
	max-width: 900px;
	padding: 50px;
}

.f-diary.f-wid-64965 .widget_diary .layout-widget-thumbnail-max time{
	display: none;
}

.f-diary.f-wid-64965 .widget_diary .title.layout-widget-thumbnail-max {
	margin: 10px 0 0 0;
}

.f-diary.f-show.f-wid-64965 .widget_diary h3.subheader {
	display: none;
}

.f-diary .horizontal-groups-and-tags {
	display: none;
}

/*photo*/


.widget_photogallery .gallery-photos {
    width:100px;
    height: 100px;
    list-style: none;
    display: block;
    float: left;
	clear: none;
	padding: 0;
	line-height: 0;
}


.widget_photogallery .gallery-photos .th{
    display: inline-block;
    width: 100%;
	padding-top: 100%;
    position: relative;
    line-height: 0;
    max-width: 100%;
	background: #ffffff;
	box-shadow: none;
	border: #ffffff solid 1px;
}

.widget_photogallery .gallery-photos .th:hover {
	box-shadow: none;
	opacity: 0.7;
}

.widget_photogallery .gallery-photos .th img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
	object-fit: cover;
}


.widget_photogallery .item_title {
    font-size: 1.8rem;
}

.photo-gallery-thumb-container {
    padding: 0;
}

.widget_photogallery .widget-thumb-rotate,
.widget_photogallery .detail-thumb-rotate{
    width: 90%;
    margin: 0 auto;
    position: relative;
    height: 0;
    padding-top: 100%;
}

.widget_photogallery .widget-thumb-rotate .letter-box,
.widget_photogallery .detail-thumb-rotate .letter-box{
    position: absolute;
    left: 0;
    margin-left: 0;
    top: 15%;
    margin-top: 0;
    width: 100%;
}

.widget_photogallery .widget-image-hover,
.widget_photogallery .detail-image-hover{
    height: auto !important;
    width: 100% !important;
}

.widget_photogallery .widget-image-hover img,
.widget_photogallery .detail-image-hover img{
    max-height: none !important;
    max-width: none !important;
    width: 100%;
}

.image-title {
    padding-bottom: 0;
}



/*biography*/

.widget_biography h3.item_title {
	display:none;
}

.widget_biography .image img {
    width: 100%;
    max-width: 800px;
    margin: auto;
    display: block;
}

/*video*/


html.f-video body.template .content_body.widget_video > .widget_header h2 {
	display: none;
}

html.f-video body.template .content_body.widget_video .right {
    text-align: right !important;
    margin-bottom: 10px;
}


.f-index.f-video body.template .content_body {
	background: #ffffff;
}

.f-index.f-video .widget_video #webstream_video_source_play .row.tile {
    display : flex;
    flex-wrap : wrap;
    justify-content:space-between;  
}

.f-index.f-video #webstream_video_source_play .tile .column {
	margin: 10px;
	width: calc(100% / 3 - 20px);
}

body.template .content_body .container {
    margin: 0;
}

html.f-video.f-show body.template .content_body.widget_video .container {
    width: 60%;
    margin: auto;
}

.flex-video-custom {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    padding-top: 56.25%;
}

.flex-video-custom iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

.iframewrap {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    margin: 30px 0;
}

.iframewrap iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/*banner*/

.widget_banner > article > .row {
    display: flex;
    flex-wrap: wrap;
}


.widget_banner div[class*="banner-"] {
	height: auto !important;
	text-align: center;
    width: calc(100% / 3);
}

.widget_banner div[class*="banner-"]  img {
    max-width: none;
    width: 100%;
}

/*fanclub*/


.f-fanclub h3.item_title {
	display: none;
}

.f-fanclub .price_plan_form table tr th {
	padding: 0.3rem 0 0 0;
	text-align: left;
}
.f-fanclub .price_plan_form table th:nth-child(2) {
	padding: 5px 0 5px 15px;
	color: #ffffff;
	text-align: left;
	background: #000000;
	width: 100%;
}
.f-fanclub .price_plan_form table th:nth-child(2) label {
	color: #ffffff;
	font-weight: bold;
}

.f-fanclub .price_plan_form table td label dl {
	display: none;
}

.f-fanclub .price_plan_form table th {
	vertical-align: top;
	width: 1.5%;
}

.f-fanclub .instruction .widget_title {
    font-size: 25px !important;
    line-height: 1.2rem !important;
}

body.template .widget_fanclub .price_plan_form .markdown p {
	line-height: 1.5rem;
}

body.template .widget_fanclub h3 {
	margin-bottom: 20px;
}
#signup_page #signup_term {
	border: #eeeeee solid 1px;
}

.f-fanclub.f-subscribe .columns.medium-centered {
	margin-bottom: 25px;
}

.f-fanclub.f-subscribe .columns.medium-centered > p.text-center {

	font-weight: bold;
}

.f-fanclub.f-subscribe .medium-10.medium-centered {
	width: 100%;
}

#officialsupporter_registration_message {
	margin-top: 15px;
}
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_First name"],
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_Gender"],
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_Date of birth"],
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_名"],
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_名（かな）"],
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_性別"],
.f-edit.f-profile.f-settings label[for*="user_fan_attributes_誕生日"],
.f-edit.f-profile.f-settings #user_fan_attributes_first_name,
.f-edit.f-profile.f-settings #user_fan_attributes_first_name_pronunciation,
.f-edit.f-profile.f-settings #user_fan_attributes_gender,
.f-edit.f-profile.f-settings #user_fan_attributes_date_of_birth_1i,
.f-edit.f-profile.f-settings #user_fan_attributes_date_of_birth_2i,
.f-edit.f-profile.f-settings #user_fan_attributes_date_of_birth_3i{
  display: none;
}

.f-edit.f-profile.f-settings label[for*="user_fan_attributes_名（かな）"]{
    display: none;
}


/*4Seasons*/
.four-seasons ul {
    margin: 0;
    padding: 0;
    letter-spacing: -1em;
}

.four-seasons li {
    width: calc(100% / 2);
    box-sizing: border-box;
    padding: 20px;
    letter-spacing: normal;
    display: inline-block;
}
.four-seasons li a {
    background: #000000;
    display: block;
}

.four-seasons li a:hover img {
    opacity: 0.8;
    transition: 0.5s;
}

.four-seasons li img {
    width: 100%;
}

/*お問い合わせ*/


.f-inquiry .large-text-area {
    max-width: 650px;
	width: 100%;
}

.f-inquiry .widget-inquiry .widget_title.left {
    float: none !important;
    font-weight: bold;
}

#new_artist_data_inquiry_item .row .small-12.medium-8.columns {
    float: none;
    margin: auto;
    text-align: center;
    max-width: 650px;
    width: 100%;
}

/*my page*/


.settings_form {
	padding-top: 0;
}

.contents_settings #settings_nav i {
	float: none;
	vertical-align: middle;
}

.contents_settings #settings_nav i.ion-ios7-person {
	margin-top: -15px;
	color: #000000;
}

.profile_index br {
	display: none;
}

.mypage_title {
	font-size: 35px;
	word-wrap: break-word;
}

.contents_settings .settings .column.medium-10.small-12,
.contents_settings .settings .show-for-medium-up {
	width: 100%;
	float: none;
}

.contents_settings #settings_nav .main_nav {
	letter-spacing: -1em;
}

.contents_settings #settings_nav .main_nav li {
	display: inline-block;
    padding: 0.3rem;
    margin: 0.5% !important;
    border: 1px #000000 solid !important;
    text-align: center !important;
    width: 24% !important;
	letter-spacing: normal;
	background: #ffffff;
}

.settings_form .table_form th {
	background-color: #ffffff;
	color:  #000000;
    border: #000000 solid 1px;
}

.settings_form .table_form td {
	background-color: #ffffff;
	color:  #000000;
    border: #000000 solid 1px;
}

.profile_index div.column {
	min-height:100px ;
}

table tr th,

table tr td {
	color: #000000;
}


/*musicdownload*/

.f-musicdownload .content-wrap {
    background:#9896a4;
}

.f-musicdownload .contents {
    background: none !important;
}

.f-musicdownload .tab {
    margin: 50px auto 0;
}

.f-musicdownload .tab-btn {
    margin: 0 auto !important;
    border: #ffffff solid 1px;
}

.widget_musicdownload .tab-content .row.tile {
    background:#ffffff !important;
    color: #000000;
    border-radius: 10px;
    padding: 20px;
}

.f-musicdownload .tab-btn li {
    background:#9896a4;
}

.f-musicdownload .tab .tab-btn li.on {
    background: #ffffff;
    color: #9896a4;
}

body.template .content_body header .right {
    float: none !important;
    text-align: center;
    margin-bottom: 8px;
}

body.template .content_body header .right a {
    font-size: 16px;
    font-family: 'PRIMETIME-Regular','Helvetica Neue', Helvetica, Arial, Verdana,'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
}

.widget_musicdownload .tag-menu.right {
    float: none !important;
    text-align: center;
}

.f-musicdownload a.label.secondary {
    background: #9896A4 !important;
    border: #ffffff solid 1px;
    font-size: 10px !important;
    padding: 5px 15px !important;
    box-sizing: border-box;
    line-height: 1 !important;
    border-radius: 5px;
    color: #ffffff;
}

.f-musicdownload .label.secondary {
    color:#ffffff;
}
.f-musicdownload span.label.secondary {
    font-size: 12px;
}

.widget_musicdownload #webstream_audio_source_play {
    width: 100%;
    max-width: 800px;
    margin: auto;
    margin-top: 10px;
    background: #ffffff !important;
    color: #000000;
    border-radius: 10px;
    padding: 20px;
}

.widget_musicdownload .container > .row > .column.medium-4:nth-of-type(1) + .column.medium-8 .introduct:nth-of-type(2) .column.medium-4 {
    width: 100%;
}

.f-musicdownload .label-add-to-cart {
    border: #000000 solid 1px;
    color: #000000 !important;
}


.f-musicdownload .cache-button,
.f-musicdownload i,
.f-musicdownload .contents a,
.f-musicdownload table tr th,
.f-musicdownload table tr td {
    color: #000000;
}

.f-musicdownload thead p {
    border-bottom: #000000 solid 1px;
}


/*footer*/
.column_footer {
    background: #000000;
}

.global-footer nav a {
	color: #ffffff;
    font-size: 18px;
}

.global-footer nav ul.footer_menu li:last-child {
	display: none;
}

.global-footer small {
	color: #ffffff;
}

.global-footer img.nav-icon-image {
    height: 2em !important;
}

.global-footer ul.footer_menu li {
    margin: 30px;
}
/*
.global-footer ul.footer_menu li:nth-child(3) a{
    border: #4d4d4d solid 1px;
    border-radius: 5px;
    display: inline-block;
    padding:5px 15px;
}
*/
/*PC*/
@media only screen and (min-width: 64em) {
}

/*TAB*/
@media only screen and (min-width: 40em) and (max-width: 64em) {
.prof li {
width:calc(100% / 2);
}

.f-index.f-video #webstream_video_source_play .tile .column {
	width: calc(100% / 2 - 20px);
}

.contents_settings #settings_nav .main_nav li {
    font-size: 11px;
}


}


/*SP*/
@media only screen and (max-width: 40em) {

.top-bar .toggle-topbar.menu-icon a::after {
    -webkit-box-shadow: 0 10px 1px 1px #ffffff, 0 16px 1px 1px #ffffff, 0 22px 1px 1px #ffffff;
    box-shadow: 0 10px 0 1px #ffffff, 0 16px 0 1px #ffffff, 0 22px 0 1px #ffffff;
    left: 5px;
height: 0.05px;
}
.off-canvas .right-menu .off-canvas-list {
	background: #000000;
}
.right-menu{
visibility: visible !important;
}

ul.off-canvas-list li a .row .column:last-child {
	border-bottom: 0.1rem solid #000000;
}

ul.off-canvas-list li a {
	font-family: 'Roboto Condensed', monospace;
	color: #ffffff;
	background: #000000;
    font-size: 1.2rem;
}

ul.off-canvas-list li label {
	display: none;
}

ul.off-canvas-list li a:hover {
    background: #eeeeee;
    color: #000000;
}

ul.off-canvas-list li a .row .column.small-2 {
	display: none;
}

ul.off-canvas-list li a .row .column.small-10 {
	width: 100%;
}

.column_billboard {
	margin-top: 64px;
}


.title-area h1.site_title a {
	background: url(//img.futureartist.net/img/hilcrhyme/hilcrhyme.svg) left top / 100% auto  no-repeat;
	width: 118px !important;
	height: 40px !important;
	text-indent: -9999px;
	display: block;
    margin: 5px 0;
}
body.template .content_body {
    padding: 30px 15px !important;
}

body.template .content_body.widget_banner {
    padding: 15px;
}

body.template header h2 > a,
.widget.content header h2,
.widget.content h2 a,
h2.widget_header,
.settings_header .settings_title,
.widget_header .header_title,
.widget_header .widget_title,
.widget_header .widget_title a,
.widget_title .widget_title,
.widget_title .widget_title a{
	font-size: 30px !important;
}

/*banner*/
.widget_banner > article > .row {
    display: inline-block;
}
/*news*/

.f-home body.template .content_body.widget_news li a {
    display: block;
    margin-top: 5px;
}

/*media*/

.f-home body.template .content_body.widget_mediainfo li a {
	display: block;
	margin-top: 10px;
}

/*event*/

body.template .content_body .complement dl dt {
	float: none !important;
}

body.template .content_body .complement dl dd {
	margin:0 0 15px;
}

.f-home body.template .content_body.widget_event li a p {
	display: inline-block;
	margin-top: 10px;
}


/*photo*/

.f-photogallery .carousel li.gallery-photos {
	width:calc(100% / 3) !important;
	height:auto !important;
}

/*banner*/
.widget_banner div[class*="banner-"] {
    width: calc(100% / 2);
}


/*feed*/
.feed-content-box .subheader {
	font-size: 11px;
}

.feed-content-box .small-9.columns {
	width: 100%;
	margin-right: 0;
	padding-right: 0;
}
.jscroll-inner div.row {
	padding: 0 !important;
}

.feed-image-box {
	width: 15%;
}

.feed-content-box {
	width: 85%;
}

.jscroll-added.pad10 {
	padding: 0 !important;
}

/*video*/
.f-index.f-video #webstream_video_source_play .tile .column {
	width: 100%;
	margin: 15px 0;
}

.f-index.f-video .widget_video .row.tile,
.f-index.f-video body.template .content_body .container {
	margin: 0;
}
html.f-video body.template .content_body.widget_video .container {
    width: 100%;
    margin: auto;
}

/*cart*/

#cart_store_list_header {
    display: none;
}


 /*購入履歴*/

.settings_form {
    padding: 15px 20px;
}

.settings_form #payment_contents .orders table.payment_table th,
.settings_form #payment_contents .orders_list table.payment_table th,
.settings_form #payment_contents .orders table.payment_table td,
.settings_form #payment_contents .orders_list table.payment_table td {
    width: 100% !important;
    display: list-item;
    list-style: none;
    text-align:left !important;
}

.product_list .custom_product_list .small-3,
.product_list .custom_product_list .small-4{
    width: 100%;
    margin-top: 15px;
    padding: 0 !important;
}
.product_list .custom_product_list .small-4 .columns {
    padding: 0;
    line-height: 1.5;

}

.settings_form #payment_contents .products,
.settings_form #payment_contents .product_list {
    padding-top: 0;

}

.settings_form #payment_contents .orders > section.columns,
.settings_form #payment_contents .orders_list > section.columns {
    padding: 0;
}


.settings_form #payment_contents > .row {
    margin: 0;
}

.f-cart_payment_infor #cash_credit_conve_row .medium-offset-2.columns {
    width: 100%;
}

/*musicdownload*/

.f-musicdownload .global-header {
    background: #9896a4;
}
.f-musicdownload .top-bar .toggle-topbar.menu-icon a::after {
    -webkit-box-shadow: 0 10px 1px 1px #ffffff, 0 16px 1px 1px #ffffff, 0 22px 1px 1px #ffffff;
    box-shadow: 0 10px 0 1px #ffffff, 0 16px 0 1px #ffffff, 0 22px 0 1px #ffffff;
}

.f-musicdownload .tab-btn li {
    height: 30px;
    line-height: 30px;

}
.f-musicdownload .tab-content .li {


    display: block;
    width: 100%;
}


.f-musicdownload .tab .tab-content > .tile-list-container.on {
    text-align: center;
}

.f-musicdownload .tag-categories.right {
    background: #9896a4;
    border: #ffffff solid 1px;
    float: none !important;
    display:inline-block;
    color: #ffffff;
    border-radius: 2px;
    margin: 10px auto 13px;
    font-size: 10px;
    padding: 6px 15px;
}

/*footer*/

.global-footer ul.footer_menu li {
    margin: 10px;
    display: inline-block;
} 

.global-footer nav a {
    font-size: 14px;
}

/*4Seasons*/
.four-seasons li {
    padding: 5px;
}

}

@media only screen and (min-width: 64.063em){
.f-settings.f-status .form_area .small-12.medium-9.large-10.columns::after {
    content: "クレジットカード決済をご選択の場合、自動的にクレジットカード情報が登録され、\A次回以降は自動更新となります。\A自動更新を希望しない場合、[お支払方法の変更]→[支払方法を設定しない]を選択してください。\A\A自動更新の場合、会員期限の翌日に決済が処理され、[MY PAGE]に会員期限が反映されます。";
    display: block;
    text-align:center;
    white-space: pre;
    line-height: 1.5;
    color: red;
}
}

@media only screen and (min-width: 40em) and (max-width: 64em){
.f-settings.f-status .form_area .small-12.medium-9.large-10.columns::after {
    content: "クレジットカード決済をご選択の場合、\A自動的にクレジットカード情報が登録され、\A次回以降は自動更新となります。\A自動更新を希望しない場合、[お支払方法の変更]→\A[支払方法を設定しない]を選択してください。\A\A自動更新の場合、会員期限の翌日に決済が処理され、\A[MY PAGE]に会員期限が反映されます。";
    display: block;
    text-align:center;
    white-space: pre;
    line-height: 1.5;
    color: red;
}
}

@media only screen and (max-width: 40em) {
.f-settings.f-status .form_area .small-12.medium-9.large-10.columns::after {
    content: "クレジットカード決済の場合、クレジットカード情報が登録され、\A次回以降は自動更新となります。\A自動更新を希望しない場合、[お支払方法の変更]→\A[支払方法を設定しない]を選択してください。\A\A自動更新の場合、会員期限の翌日に決済が処理され、\A[MY PAGE]に会員期限が反映されます。";
    display: block;
    text-align:left;
    white-space: pre;
    font-size: 12px;
    line-height: 1.5;
    color: red;
}

}

@media only screen and (max-width: 480px) {

.f-settings.f-status .form_area .small-12.medium-9.large-10.columns::after {
    content: "クレジットカード決済をご選択の場合、\A自動的にクレジットカード情報が登録され、\A次回以降は自動更新となります。\A自動更新を希望しない場合、[お支払方法の変更]→\A[支払方法を設定しない]を選択してください。\A\A自動更新の場合、会員期限の翌日に決済が処理され、\A[MY PAGE]に会員期限が反映されます。";
    display: block;
    text-align:left;
    white-space: pre;
    font-size: 12px;
    line-height: 1.5;
    color: red;
}

}


/*15th 特設*/

    .f-15th_special .global-header,
    .f-15th_history .global-header {
        display: none;
    }
    
    .f-15th_special .header_title,
.f-15th_history .header_title {
        display: none;
    }

    .f-15th_special .content-wrap, 
    .f-15th_special .contents,
    .f-15th_special body.template .content_body,
    .f-15th_special body,
    .f-15th_history .content-wrap, 
    .f-15th_history .contents,
    .f-15th_history body.template .content_body,
    .f-15th_history body{
        background-color: #040404 !important;
        color: #ffffff;
    }

    .f-15th_special body.template .content_body,
    .f-15th_history body.template .content_body{
        max-width: none;
        padding: 0 !important;
    }

    #special_15th .top img{
        width: 100%;
    }

    .news_15 {
        max-width: 920px;
        width: 100%;
        margin: auto;
    }

/”特設TOP*/
    .f-15th_special .global-header {
        display: none;
    }
    
    .f-15th_special .header_title {
        display: none;
    }


    .f-15th_special .content-wrap, 
    .f-15th_special .contents,
    .f-15th_special body.template .content_body,
    .f-15th_special body{
        background-color: #040404 !important;
        color: #ffffff;
    }

    .f-15th_special body.template .content_body{
        max-width: none;
        padding: 0;
    }

    #special_15th .top img{
        width: 100%;
    }

    .section__title {
        font-family: "orpheuspro", serif;
        font-size: 48px;
        font-weight: 500 !important;
        text-align: center;
    }

    .news_15 {
        max-width: 920px;
        width: 100%;
        margin: auto;
    }

    .news15 .section__title {
        color: #D7D7D7;
    }

    .news15 .section__inner {
        padding: 20px 0 72px;
        box-sizing: border-box;
        max-width:930px;
        width:100%;
        margin:auto;
    }


    .tour {
        background-color:#D7D7D7 ;
        padding: 80px 20px 52px;
        box-sizing: border-box;
    }

    .tour .section__title {
        color: #040404;
    }

    .tour .section__inner {
        display: flex;
        margin: auto;
        max-width: 872px;
        width: 100%;
    }

    .tour__title {
        max-width: 280px;
        width: 100%;
        margin-bottom: 28px;
        margin: 20px 0 0;
    }

    .tour__box {
        margin-left: 72px !important;
        max-width: 520px;
        width: 100%;
    }

    .tour__list-item{
        color: #040404;
        display: flex;
        padding-bottom: 0px;
        align-items: flex-start;
        gap: 16px;
        padding-top: 20px;
    }

    .tour__list-item + .tour__list-item {
        border-top: 1px solid #BBB;
    }

    .tour__list-item--date,
    .tour__list-item--contents {
        font-size: 17px !important;
        line-height: 1.8 !important;
        font-family: "Hiragino Kaku Gothic ProN";
    }

    .tour__list-item--contents span{
        font-size: 12px !important;
    }

    .tour__ticket-title {
        color:#040404;
        font-family: Hiragino Kaku Gothic ProN;
        font-size: 17px !important;
        font-weight: 600 !important;
        line-height: 1.8 !important;
        margin-bottom: 8px;
        margin-top: 28px;
    }
    .tour__ticket-sales{
        color:#040404;
        font-family: Hiragino Kaku Gothic ProN;
        font-size: 16px !important;
        font-weight: 300;
       line-height: 2 !important;
    }
    .tour__ticket-sales a{
        color: #1883C3;
        display:inline-block;
        text-decoration: underline;
    }

    .tour__ticket-sales a:hover{
        opacity: 0.7;
    }

    .historyTop {
        text-align: center;
        background-color: #2A4454;
        padding: 80px 20px 52px;
        box-sizing: border-box;
    }

    .historyTop .section__title {
        color: #D7D7D7;
        margin: 0 auto 12px;
    }

    .historyTop .section__inner {
        display: flex;
        margin: auto;
        flex-direction: column;
    }

    .historyTop__img {
        max-width: 122px;
        width: 100%;
        margin: auto auto 40px;
    }

    .historyTop__img a:hover{
        opacity: 0.7;
    }

    .historyTop__link img{
        width: 6px;
        display: inline-block;
        margin-right: 5px;
        vertical-align: middle;
    }

    .historyTop__link a{
        color: #D7D7D7 !important;
        font-size: 15px;
    }

 .historyTop__link a:hover{
        opacity: 0.7;
    }

   .f-15th_special .banner .section__inner {
        padding: 40px 20px;
        box-sizing: border-box;
    }

   .f-15th_special  .banner img {
        display: block;
        max-width: 520px;
        width: 100%;
        margin: auto;
    }

    .videotop{
        padding: 80px 20px;
        box-sizing: border-box;
    }

    .videotop .section__title{
        color: #D7D7D7;

    }

    .videotop .section__inner {
        max-width: 920px;
        width: 100%;
        margin: auto;
    }

      @media (min-width: 641px) {
.f-15th_special .hamburger-menu .drawer-icon,
.f-15th_history .hamburger-menu .drawer-icon {
display: none;
}
    .f-15th_special .pc{
        display: block;
    }
    .f-15th_special .sp{
        display: none;
    } 

    .special_15th,
.f-15th_history .history {
        position: relative;
    }

    .special_15th .nav,
.f-15th_history .history .nav {
        position: absolute;
        max-width: 930px;
        width: 100%;
        padding:48px 30px ;
        box-sizing: border-box;
        margin: auto;
        left: 0;
        right: 0;
    }

    .special_15th .nav__list,
.f-15th_history .history .nav__list {
        display: flex;
        flex-direction: row;
        justify-content: flex-end;
    }

    .special_15th .nav__list .nav__list-item,
.f-15th_history .history .nav__list .nav__list-item {
        margin-left: 25px;
    }

    .special_15th .nav__list .nav__list-item a,
.f-15th_history .history .nav__list .nav__list-item a{
        color:#D7D7D7;
        font-family: "orpheuspro", serif;
        font-size: 15px;
    }
    
    .special_15th .nav__list .nav__list-item a:hover,
.f-15th_history .history .nav__list .nav__list-item a:hover{
        color: #A8DEFF;
    }

}
    @media (max-width: 640px) {

    .f-15th_special .pc{
        display: none;
    }
    .f-15th_special .sp{
        display: block;
    }  

    .f-15th_special .column_billboard {
        margin-top: 0;
    }

    .f-15th_special body.template .content_body {
        padding: 0 !important;
    }
    .f-15th_special .right-menu {
    visibility: hidden !important;
}


    .drawer-icon {
    display: block;
    cursor: pointer;
    position: fixed;
    top: 18px;
    right: 16px;
    justify-content: center;
    align-items: center;
    z-index: 100;
    background-color: transparent;
    border: none;
    width: 20px;
    height: 20px;
  }
  .drawer-icon span {
    content: "";
    display: block;
    height: 1px;
    width: 25px;
    border-radius: 3px;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease-in-out 0s;
  }
  .drawer-icon span::before, .drawer-icon span::after {
    content: "";
    display: block;
    height: 1px;
    width: 25px;
    border-radius: 3px;
    background-color: #ffffff;
    position: absolute;
    transition: all 0.5s ease-in-out 0s;
  }
  .drawer-icon span::before {
    bottom: 8px;
  }
  .drawer-icon span::after {
    top: 8px;
  }
  .is-active2.drawer-icon span {
    background-color: rgba(255, 255, 255, 0);
  }
  .is-active2.drawer-icon span::before {
    bottom: 0;
    transform: rotate(-45deg);
    background-color: #ffffff;
  }
  .is-active2.drawer-icon span::after {
    top: 0;
    transform: rotate(45deg);
    background-color: #ffffff;
  }

  .menu-content {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    width: 100vw;
    height: 100vh;
    background: #040404;
    transform: translateX(100vw);
    transition: transform 0.3s linear;
  }

    .menu-content.is-active {
    transform: translateX(0);
  }

  button:hover, button:focus, .button:hover, .button:focus{
    background-color: transparent;
  }

.menu-content ul {
    padding: 70px 40px 0;
    box-sizing: border-box;
}
.menu-content ul li {
    list-style: none;
}
.menu-content ul li a {
    display: block;
    width: 100%;
    font-size: 17px;
    box-sizing: border-box;
    color:#ffffff;
    text-decoration: none;
    padding: 9px 15px 10px 0;
    position: relative;
    font-family: "orpheuspro", serif;
}

    .section__title{
        font-size: 32px;
    }

    .news15{
        padding: 52px 20px 44px;
        box-sizing: border-box;
    }

    .news15 .section__inner {
        padding: 20px 0 0;
        box-sizing: border-box;
    }

    .tour {
        padding: 52px 20px 36px;
    }
.tour .section__title {
    margin-bottom: 28px;
}

    .tour .section__inner{
        flex-direction: column;
    }

    .tour__title {
        max-width: 188px;
        margin: auto auto 10px;
    }
.tour__list-item--date, .tour__list-item--contents {
    font-size: 15px !important;
}
    .tour__box{
    margin-left: 0!important;
    max-width: 100%;
    }
    .tour__ticket-sales {
        line-height: 1!important;
    }
    .tour__ticket-sales a {
        display:block;
        line-height: 1.8;
    }
    .historyTop {
        padding: 52px 20px 44px;
    }

   .f-15th_special .banner .section__inner{
        padding:20px 20px 0 ;
    }


    }

/*HISTORY*/
.f-15th_history p:empty {
    display: none;
}

.f-15th_history .history p {
    margin: initial;
  font-size: initial;
}

.f-15th_history .history{
    overflow-x: hidden;
    background: #040404 url(//img.futureartist.net/img/hilcrhyme/hilcrhyme15th/img_bg_pc.png) center top  no-repeat;
    background-size: 100% auto;
    color: #ffffff;
}

.f-15th_history .history .section__title{
    color: #D7D7D7;
    margin-top: 160px;
}

.f-15th_history .history_inner {
    max-width: 1150px;
    width: 100%;
    margin: 9.2rem auto !important;
    padding: 0 38px !important;
    box-sizing: border-box;
}


.f-15th_history .history table {
    margin: auto;
    position: relative;
    
}

.f-15th_history .history table::before{
    content: "";
    background-color:#D7D7D7;
    width: 2px;
    height: 99.6%;
    display: block;
    position: absolute;
    z-index: 0;
    top: 40px;
    left: 0;
    right: 0;
    margin: auto;
}

.f-15th_history .history th {
    position: relative;
}

.scroll_up {
    transition: 0.8s ease-in-out;
    opacity: 0;
  }
  .scroll_up.on {
    transform: translateY(0);
    opacity: 1.0;
  }

  .scroll_left {
      -webkit-transition: 0.8s ease-in-out;
      -moz-transition: 0.8s ease-in-out;
      -o-transition: 0.8s ease-in-out;
      transition: 0.8s ease-in-out;
      transform: translateX(-30px);
      opacity: 0;
      filter: alpha(opacity=0);
      -moz-opacity: 0;
  }
  .scroll_left.on {
      opacity: 1.0;
      filter: alpha(opacity=100);
      -moz-opacity: 1.0;
      transform: translateX(0);
  }
  .marker-left.scroll_up span::before{
    position: absolute;
    content: "";
    height: 4px;
  }


  .scroll_right {
      -webkit-transition: 0.8s ease-in-out;
      -moz-transition: 0.8s ease-in-out;
      -o-transition: 0.8s ease-in-out;
      transition: 0.8s ease-in-out;
      transform: translateX(30px);
      opacity: 0;
      filter: alpha(opacity=0);
      -moz-opacity: 0;
  }
  .scroll_right.on {
      opacity: 1.0;
      filter: alpha(opacity=100);
      -moz-opacity: 1.0;
      transform: translateX(0);
  }


  .marker-right.scroll_up span::before{
    position: absolute;
    content: "";
    height: 4px;
  }


.f-15th_history .history th .year {
    font-family: "orpheuspro", serif;
    font-size: 24px !important;
    letter-spacing: 2px;
    font-weight: 500;
    color: #D7D7D7;
    width: 84px;
    height: 84px; 
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #040404;
    border-radius:50% ;
    border:#D7D7D7 solid 1px;
    margin: auto;

}

.f-15th_history .history th.yearLine {
    padding-top: 92px;
}

.f-15th_history .history th.yearLine.first {
    padding-top: 0;
}

.f-15th_history .history th .dot{
    font-size: 10px !important;
    position: absolute;
    top: 70px;
    right: 0;
    left: 0;
    margin: auto;
    color: #D7D7D7;
}

.f-15th_history .history th .dot::before {
    border-top: #D7D7D7 solid 1px;
    color: #D7D7D7;
    position: absolute;
    content: "";
    height: 4px;
    top: 7px;
}
.f-15th_history .history th.marker-left .dot.sp{
    display: none;
}

.f-15th_history .history th.marker-left .dot::before {
    right: 0;
    transform: translateX(-62px);
}

.f-15th_history .history th.marker-right .dot::before {
    left: 0;
    transform: translateX(62px);
}

.f-15th_history .history th.marker-left .jacket::before {
    right: 0;
    transform: translateX(-62px);
    z-index: -1;
}

.f-15th_history .history th.marker-right .jacket::before {
    left: 0;
    transform: translateX(62px);
    z-index: -1;
}

.f-15th_history .history th.marker-right.on .jacket::before,
.f-15th_history .history th.marker-left.on .jacket::before,
.f-15th_history .history th.marker-right.on .dot::before,
.f-15th_history .history th.marker-left.on .dot::before {
    width: 535px;

}

.f-15th_history .history th.marker-right .dot.sp::before,
.f-15th_history .history th.marker-left .dot.sp::before {
    content: none;
}

.f-15th_history .history th .jacket{
    margin: auto;
    width: 120px;
    height: 120px;
    display: block;
    padding-top: 40px;
}

.f-15th_history .history th .jacket::before {
    border-top: #D7D7D7 solid 1px;
    color: #D7D7D7;
    position: absolute;
    content: "";
    width: 0;
    height: 4px;
    top: 100px;
}

.f-15th_history .history th .jacket a{
    display: block;
}

.f-15th_history .history th .jacket img{
    width: 100%;
    display: block;
}


.f-15th_history .history td {
    padding-top: 40px;
    vertical-align: top;
    box-sizing: border-box;
    width: 50%;
    position: relative;
}

 .f-15th_history .history td.jacket_img {
    padding-top: 60px;
} 

.f-15th_history .history td .text {
    width: 447px;
    position: relative;
    font-family: "Hiragino Kaku Gothic ProN";
    color: #D7D7D7;
}

.f-15th_history .history td.right-box {

    box-sizing: border-box;
}

.f-15th_history .history td.right-box .topbox,
.f-15th_history .history td.right-box .text{
    padding-left: 26px;
    box-sizing: border-box;
line-height: 1.8 !important;
}

.f-15th_history .history td.left-box .topbox,
.f-15th_history .history td.left-box .text{
    padding-right: 26px;
    box-sizing: border-box;
line-height: 1.8 !important;
}


.left-box p,
.right-box p {
    font-size: 1.5rem !important;
}


.topbox{
    line-height: 1.8 !important;
    padding-bottom: 20px;
} 

.f-15th_history .history .date{
  color: #D7D7D7;
  font-family: "orpheuspro", serif;
  font-size: 18px !important;
  font-weight: 500;
  display: inline-block;
  vertical-align: middle;
  line-height: 1.8 !important;
}

.f-15th_history .history .label {
    display: inline-block;
    vertical-align: middle;
    border-radius: 2px;
    width: 64px;
    padding: 5px 0 3px;
    text-align: center;
    color: #FFF;
    font-family: "Hiragino Kaku Gothic ProN";
    font-size: 11px !important;
    font-style: normal;
    font-weight: 300;
    line-height: 1;
    margin-left: 12px !important;
}

.f-15th_history .history .single{
    background: #447593;
}

.f-15th_history .history .other{
    background: #4C4E50;
}

.f-15th_history .history .event{
    background: #6C608E;
}

.f-15th_history .history .album{
    background: #95854C;
}

.f-15th_history .history .media{
    background: #4F805C;
}

.f-15th_history .history .video{
    background: #42578E;
}

.f-15th_history .history td.last div{
    padding-top:130px;
}

.f-15th_history .history td.last p {
    text-align: center;
    line-height: 1;
    margin-top: -40px;
    color: #D7D7D7;
    font-size: 18px;
}


 .link-parts {
	display: inline-block;
	font-size: 18px !important;
	padding: 0.8em 2em 0.4em 1.3em;
	position: relative;
	color: #ffffff !important;
	z-index: 1;
  transform: rotate( 90deg );
  font-family: "orpheuspro", serif;
}
.link-parts::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: #040404;
  transform: scaleY(1) perspective(0.9em) rotateX(2deg);
	transform-origin: bottom left;
	border-radius: 4px 4px 0 0;
}

.link-parts:hover{
  color: #040404 !important;
}
.link-parts:hover::before {
  background: #d7d7d7;
}

.link-area {
  position: fixed;
  left: -51px;
  display: flex;
  flex-direction: column;
  top: 230px;
}

.link-box {
  height: 154px;
}


/*modal*/

.modal__header{
    border-bottom: 1px solid #2C3133;
    display: block;
    padding:0 0 20px;
    text-align: left;
    background: none;
    height: auto;
    position: static;
}

.modal__title{
    font-family: "Hiragino Kaku Gothic ProN";
    font-size: 18px !important;
    font-weight: 600!important;
    text-align: left;
    color: #D7D7D7;
}

.modal__release {
    font-family: "orpheuspro", serif;
    font-size: 13px !important;
    font-style: normal;
    font-weight: 500!important;
    text-align: left;
    display: block;
}

.modal__contents {
    padding-top: 30px;
}

.modal__img {
    max-width: 340px;
    width: 100%;
    margin: 0;
}

.modal__box {
    display: flex;
}

.modal__list {
    text-align: left;
    margin-left: 48px !important;
}

.modal__list-item{
    font-size:14px !important ;
}

@media only screen and (min-width: 641px) and (max-width: 1100px) {
.f-15th_history .history td.right-box img,
.f-15th_history .history td.left-box img,
.f-15th_history .history td.right-box p,
.f-15th_history .history td.left-box p {
    float: none;
    margin: 0;
    font-size: 14px !important;
}


.f-15th_history .history th.marker-right.on .jacket::before,
.f-15th_history .history th.marker-right.on .dot::before{
    margin: 0 calc(23% - 23vw);
    width: 46vw;
    transform: translateX(58%);
}
.f-15th_history .history th.marker-left.on .jacket::before,
.f-15th_history .history th.marker-left.on .dot::before{
    margin: 0 calc(23% - 23vw);
    width: 46vw;
    transform: translateX(-58%);
}

.f-15th_history .history th.marker-left .dot.sp{
    display: none;
}

.f-15th_history .history td .text {

    position: relative;
    line-height: 1.5 !important;
}

.f-15th_history .history td.right-box .topbox,
.f-15th_history .history td.right-box .text {

    padding-right: 0;
    width: 100%;
    box-sizing: border-box;
}

.f-15th_history .history td.left-box .topbox, 
.f-15th_history .history td.left-box .text{

    padding-left: 0;
    width: 100%;
    box-sizing: border-box;
}


}
@media only screen and (min-width: 641px) and (max-width: 826px) {
.f-15th_history .history th.marker-right.on .jacket::before,
.f-15th_history .history th.marker-right.on .dot::before{
    transform: translateX(60%);
}
.f-15th_history .history th.marker-left.on .jacket::before,
.f-15th_history .history th.marker-left.on .dot::before{
    transform: translateX(-60%);
}
}

@media (max-width: 640px) {
    .f-15th_history .right-menu {
    visibility: hidden !important;
}
.f-15th_history .history{
    background: #040404 url(//img.futureartist.net/img/hilcrhyme/hilcrhyme15th/img_bg_sp.png) center top  no-repeat;
    background-size: 100% auto;
}

.f-15th_history .history_inner {
    margin: 2.2rem auto !important;
    padding: 0 !important;
}

.f-15th_history .history .section__title {
    margin-top: 56px;
}

.f-15th_history .column_billboard {
    margin-top: 0 !important;
}

.f-15th_history .history table {
    width: 100%;
}
    
.f-15th_history .history table::before {
    margin: auto 0 auto 28px;
}

.f-15th_history .history th.yearLine {
    width: 100vw;
   margin: 0 calc(50% - 50vw);
}

.f-15th_history .history th.yearLine + td{
    padding-top: 0 !important;
}

/* .f-15th_history .history th .year {
    margin: auto 100px auto 0px;
    font-size: 22px !important;
    width: 80px;
    height: 80px;
} */
.f-15th_history .history th .year {
    font-size: 15px !important;
    width: 50px;
    height: 50px;
    margin: auto 100px auto -4px;
}
   

.f-15th_history .history td{
    padding-top: 30px;
}

.f-15th_history .history table tr td,
.f-15th_history .history table tr th {
    display: list-item;
    list-style: none;
    width: 100%;
}


.f-15th_history .history table tr th {
    margin: auto;
}

.f-15th_history .history td:empty {
    padding: 0;
}


.f-15th_history .history th .dot{
    text-align: left;
    left: 22px;
    top:72px;
}


.f-15th_history .history td.right-box .topbox,
.f-15th_history .history td.right-box .text,
.f-15th_history .history td.left-box .topbox,
.f-15th_history .history td.left-box .text{
    padding-left: 50px;
    width: 90%;
}

.f-15th_history .history td.right-box .text,
.f-15th_history .history td.left-box .text{
    font-size: 14px !important;
    line-height: 1.6 !important;
}

.f-15th_history .history th.marker-right.on .jacket::before,
.f-15th_history .history th.marker-left.on .jacket::before, 
.f-15th_history .history th.marker-right.on .dot::before,
.f-15th_history .history th.marker-left.on .dot::before{
    width: 90%;
}
.f-15th_history .history th.marker-right .dot::before{
    transform: translateX(0);
}

.f-15th_history .history th.marker-left .dot::before{
    transform:none;
    left:0;
}

.f-15th_history .history th.marker-right .dot.sp,
.f-15th_history .history th.marker-left .dot.sp{
        display: block;
    }

.f-15th_history .history th.marker-left .dot.sp::before{
        content: "";
        transform: none;
        left: 0;
        display: block;
    }

.f-15th_history .history th.marker-right .dot.sp::before{
        transform: none;
        left: 0;
        display: block;
        content: "";
    }
.f-15th_history .history th.marker-left .jacket::before{
        content: none;
    }

.f-15th_history .history th.marker-right .jacket::before{
        content: none;
    } 

.f-15th_history .history th.marker-left .dot.sp{
    display: block;
    top: -48px;
}


.f-15th_history .history .left_sect {
    display: flex;
    flex-direction: column;
}


.f-15th_history .history .left_sect .marker-left{
    order: 2;
}

.f-15th_history .history .left_sect .left-box{
    order: 3;
}

.f-15th_history .history th .jacket{
    width: 80px;
    height: 80px;
    position: absolute;
    right: 29px;
}

.f-15th_history .history th.marker-left .jacket{
    top: -175px;
}

.f-15th_history .history th.marker-right .jacket{
    top: 0;
    padding-top: 0;
}


.f-15th_history .history th.yearLine{
    padding-top: 0;
}

.f-15th_history .history th.jacket_2011 .dot.sp {
    top: 105px;
}
.f-15th_history .history th.jacket_2011 .jacket {
    top: 17px;
}

.f-15th_history .history th.jacket_2015 .dot.sp {
    top: 105px;
}

.f-15th_history .history th.jacket_2021 .dot.sp {
    top: 105px;
}

.f-15th_history .history th.jacket_2021 .jacket {
    top: 14px;
}

.f-15th_history .history th.jacket_2022 .dot.sp {
    top: -72px;
}

.f-15th_history .history th.jacket_2022 .jacket {
    top: -200px;
}

.f-15th_history .history td.last p{
    margin-top: -43px;
    text-align: left;
    margin-left: 12px;   
}

.f-15th_history .history td.right-box{
    z-index: 1;
}

.f-15th_history .history th.marker-right{
    z-index: 2;
}

.link-parts {
	display: block;
	font-size: 12px !important;
	padding: 0.8em 1em 0.4em 1.3em;
	position: relative;
	color: #ffffff;
	z-index: 1;
    transform: none;
  font-family: "orpheuspro", serif;
  z-index: 100;
  width: 90px;
  text-align: center;
}
.link-parts::before {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: -1;
	background: #040404;
  transform: scaleY(1) perspective(0.9em) rotateX(2deg);
	transform-origin: bottom right;
	border-radius: 2px 2px 0 0;
}

.link-parts:hover{
  color: #040404;
}
.link-parts:hover::before {
  background: #d7d7d7;
}

.link-area {
    position: fixed;
    right: 0;
    left: calc(100% + 30px);
    display: flex;
    flex-direction: row;
    z-index: 19;
    transform: rotate( -90deg );
    top: 336px;
}

.link-box {
  height: 123px;
  display: block;
}

.link-box:nth-child(1){
    order: 3;
}

.link-box:nth-child(2){
    order: 2;
}

.link-box:nth-child(3){
    order: 1;
}

/*modal*/

.remodal.index_modal{
    margin-top: 50px;
}

.modal__box {
    flex-direction: column;
}

.modal__img {
    max-width: 100%;
}

.modal__list{
    margin: 50px 0 0 0 !important;
    font-size: 14px !important;
    font-style: normal;
    font-weight: 300;
    line-height: 260%;
}

}


@media (max-width: 470px) {
 

.f-15th_history .history th .jacket{
        right: 40px;
    }

.f-15th_history .history th.marker-left .dot::before{
        transform:none;
        left:0;
    }


.f-15th_history .history th.marker-right .dot.sp,
.f-15th_history .history th.marker-left .dot.sp{
        display: block;
        top:-48px;
    }

.f-15th_history .history th.marker-left .dot.sp::before{
        transform: none;
        left: 0;
        display: block;
        content: "";
    }

.f-15th_history .history th.marker-right .dot.sp::before{
        transform: none;
        left: 0;
        display: block;
        content: "";
    }
.f-15th_history .history th.marker-left .jacket::before{
        content: none;
    }

.f-15th_history .history th.marker-right .jacket::before{
        content: none;
    } 

.f-15th_history .history .chosei .dot.sp{
        top: 103px !important;
    }

    .f-15th_history .history .date {
        font-size: 15px !important;
        line-height: 1.4 !important;
    }
    
    .f-15th_history .history .label{
        font-size: 10px !important;
        width: 56px;
    }
    
    .f-15th_history .history td.right-box .text,
    .f-15th_history .history td.left-box .text{
        font-size: 13px !important;
        line-height: 1.6 !important;
    }
    
    
    .f-15th_history .history th .jacket{
        width: 60px;
        height: 60px;
        position: absolute;
    }
    
    
    
    /* .f-15th_history .history th.marker-left .jacket{
        top: -150px;
    } */

    .f-15th_history .history th.marker-right .jacket{
        padding-top: 40px;
    }

    .f-15th_history .history th.jacket_2010 .dot.sp {
        top: -65px;
    }

    .f-15th_history .history th.jacket_2010 .jacket {
        top: -167px;
    }

    .f-15th_history .history th.jacket_2010-2 .dot.sp {
        top: -42px;
    }

    .f-15th_history .history th.jacket_2010-2 .jacket {
        top: -147px;
    }

    .f-15th_history .history th.jacket_2011 .dot.sp {
        top: 102px;
    }

    .f-15th_history .history th.jacket_2011 .jacket {
        top: -4px;
    }

    .f-15th_history .history th.jacket_2012 .jacket {
        top: -152px;
    }

    .f-15th_history .history th.jacket_2014 .jacket {
        top: -152px;
    }

    .f-15th_history .history th.jacket_2015 .dot.sp {
        top: 102px;
    }

    .f-15th_history .history th.jacket_2016 .jacket {
        top: -152px;
    }

    .f-15th_history .history th.jacket_2020 .jacket {
        top: -152px;
    }

    .f-15th_history .history th.jacket_2021 .dot.sp {
        top: 103px;
    }

    .f-15th_history .history th.jacket_2021 .jacket {
        top: -4px;
    }

    .f-15th_history .history th.jacket_2022 .dot.sp{
        top: -65px;
    }

    .f-15th_history .history th.jacket_2022 .jacket {
        top: -170px;
    }

}