@charset "UTF-8";


/***************************************************

	media

***************************************************/

.media_list{
	width: 100%;
}

.media_list li{
	width: 100%;
	padding: 16px 0;
	position: relative;
	display: flex;
	align-items: center;
}

.media_list li:first-child::before,
.media_list li::after{
	content: '';
	display: block;
	width: 100%;
	height: 2px;
	background-repeat: repeat-x;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/media/line.png');
	position: absolute;
	bottom: 0;
	left: 0;
}

.media_list li:first-child::before{
	top: 0;
	bottom: unset;
}

.media_list li .list_head{
	width: calc(100% - 672px);
}

.media_list li .list_head .date{
	font-size: 16px;
	font-weight: 700;
	color: var(--text2);
	margin-bottom: 4px;
}

.media_list li .list_head .icon{
	height: 23px;
	position: relative;
}

.media_list li .list_head .icon::after{
	content: '';
	display: inline-block;
	width: 82px;
	height: 23px;
	line-height: 25px;
	background: #ccc;
	font-size: 12px;
	font-weight:400;
	font-family: "Cinzel", serif;
	color: #fff;
	text-align: center;
    position: absolute;
    top: 0;
    left: 0;
    white-space: nowrap;
}

.media_list li .list_head .icon.x::after{
	content: 'X';
	background: #4D4D4D;
}

.media_list li .list_head .icon.youtube::after{
	content: 'YouTube';
	background: #6B152A;
}

.media_list li .list_head .icon.magazine::after{
	content: 'Magazine';
	background: #6B5615;
}

.media_list li .list_head .icon.tv::after{
	content: 'TV';
	background: #2B6B15;
}

.media_list li .list_head .icon.web::after{
	content: 'WEB';
	background: #152B6B;
}

.media_list li .list_head .icon.newspaper::after{
	content: 'Newspaper';
	background: #56156B;
}

.media_list li .list_cont{
	width: 672px;
}

.media_list li .list_cont a,
.media_list li .list_cont p{
	display: block;
	font-size: 16px;
	font-weight: 500;
	color: var(--text2)
}

.media_list li .list_cont a{
	padding-right: 30px;
	position: relative;
}

.media_list li .list_cont a::after{
	content: '';
	display: block;
	width: 24px;
	height: 24px;
	background-repeat: no-repeat;
	background-position: 0 0;
	background-size: contain;
	background-image: url('../images/common/icon_link.png');
	position: absolute;
	bottom: 0;
	right: 0;
}





/********************************************************************************
	リッキド用 CSS
********************************************************************************/

@media(max-width:1440px){


.media_list{
}

.media_list li{
	padding: 1.111111vw 0;
}

.media_list li:first-child::before,
.media_list li::after{
	height: 0.138889vw;
}

.media_list li .list_head{
	width: calc(100% - 46.666667vw);
}

.media_list li .list_head .date{
	font-size: 1.111111vw;
	margin-bottom: 0.277778vw;
}

.media_list li .list_head .icon{
	height: 1.597222vw;
}

.media_list li .list_head .icon::after{
	width: 5.694444vw;
	height: 1.597222vw;
	line-height: 1.736111vw;
	font-size: 0.833333vw;
}

.media_list li .list_cont{
	width: 46.666667vw;
}

.media_list li .list_cont a,
.media_list li .list_cont p{
	font-size: 1.111111vw;
}

.media_list li .list_cont a{
	padding-right: 2.083333vw;
}

.media_list li .list_cont a::after{
	width: 1.666667vw;
	height: 1.666667vw;
}








}

/********************************************************************************
	スマートフォン用 CSS
********************************************************************************/

@media(max-width:460px){

#page_header .text_wrapper .header_title img {
	height: 20vw;
}

#page_header .text_wrapper .main {
	margin-top: 5.333333vw;
}

.media_list{

}

.media_list li{
	padding: 3.466667vw 0 4.266667vw;
	display: block;
}

.media_list li:first-child::before,
.media_list li::after{
	height: 0.533333vw;
}

.media_list li .list_head{
	width: auto;
	display: flex;
	align-items: center;
	margin-bottom: 2.4vw;
}

.media_list li .list_head .date{
	font-size: 4.266667vw;
	margin: 0 2.933333vw 0 0;
}

.media_list li .list_head .icon{
	height: 6.133333vw;
}

.media_list li .list_head .icon::after{
	width: 21.866667vw;
	height: 6.133333vw;
	line-height: 6.666667vw;
	font-size: 3.2vw;
}

.media_list li .list_cont{
	width: auto;
}

.media_list li .list_cont a,
.media_list li .list_cont p{
	font-size: 3.733333vw;
}

.media_list li .list_cont a{
	padding-right: 6.4vw;
}

.media_list li .list_cont a::after{
	width: 5.333333vw;
	height: 5.333333vw;
}









}