﻿@charset "utf-8";

.preload * {
-webkit-transition: none !important;
-moz-transition: none !important;
-ms-transition: none !important;
-o-transition: none !important;
transition: none !important;
opacity: 0;
}

.notoM {
	font-family: 'Noto Serif JP', serif;
	font-weight: 500;
	font-style: italic;
}



#v0006 {

	display: block;

}

/* @group MainVisual ------------------------------ */

#mainVisual {
	position: relative;
	width: 100%;
	height: 0;

	padding-top: 46.5%;
	overflow: hidden;
}

#mainVisual .visual {
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

#mainVisual .visual img {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 100%;
	height: auto;
	/*min-width: 100%;
	min-height: 100%;*/
	max-width: inherit;
	transform: translate(-50%, -50%);
}

#mainVisual .visual h1 img {
	min-height: 0;
	min-width: 0;

	/*width: 496px;*/
	width: 626px;

	height: auto;
}

/* @end */

#topCont {
	width: 100%;
	max-width: 1280px;
	padding: 120px 3.125% 90px;
	margin: 0 auto;
	font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Hiragino Sans', 'ヒラギノ角ゴシック', '游ゴシック', 'Yu Gothic', 'メイリオ', 'Meiryo', sans-serif;
}

@media screen and (min-width: 1280px)
{
	#topCont
	{
		padding: 120px 40px 90px;
	}						
}

/*#topCont h1 {
	margin: 0 0 72px;
	text-align: center;
}*/

#topCont .description {
	margin: 0 0 133px;
	font-size: 16px;
	line-height: calc(5/2);
	letter-spacing: 0.1em;
	text-align: center;
}

/* @group ArticleList ------------------------------ */

#topCont .thumbListArea {
	margin: 0 0 72px;
}


#topCont .thumbListArea .sortList {
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 0 80px;
	list-style-type: none;
}

#topCont .thumbListArea .sortList li {
	position: relative;
	margin: 0 25px;
	padding: 14px 20px;
	box-sizing: border-box;
	border-bottom: 2px solid #fff;
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.15em;
	cursor: pointer;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#topCont .thumbListArea .sortList li:hover,
#topCont .thumbListArea .sortList li.ac {
	border-color: #000;
}


#topCont .thumbListArea .thumbList {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

#topCont .thumbListArea .thumbBlock {
	width: 48.33333333333%;
	margin: 0 0 45px;
}

#topCont .thumbListArea .thumbBlock .thumb {
	position: relative;
	width: 100%;
	height: 0;
	margin: 0 0 20px;
	padding-top: 72.413793%;
}

#topCont .thumbListArea .thumbBlock a {
	color: #222;
	text-decoration: none;
}

#topCont .thumbListArea .thumbBlock .thumb img {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
}

/*#topCont .thumbListArea .thumbBlock .genre {
	display: inline-block;
	height: 26px;
	margin: 0 0 15px;
	padding: 6px 15px 0 17px;
	border: 1px solid #000;
	border-radius: 13px;
	box-sizing: border-box;
	font-family: Avenir, helvetica, Arial, sans-serif;
	font-size: 14px;
	line-height: 1;
	letter-spacing: 0.15em;
}*/




#topCont .thumbListArea .thumbBlock .product,
#topCont .thumbListArea .thumbBlock .title {
	font-size: 18px;
	line-height: calc(16/9);
	letter-spacing: 0.06em;
}



#topCont .thumbListArea .thumbBlock .title {

	font-size: 16px;

	line-height: 2;

}

#topCont .thumbListArea .thumbBlock .product {
	margin: 0 0 3px;
	font-weight: 600;
}

#topCont .thumbListArea .thumbBlock .tagList {
	display: flex;
	margin: 8px 0 0;
}

#topCont .thumbListArea .thumbBlock li {
	margin: 0 18px 5px 0;
	/*padding: 6px 13px 6px 15px;*/

	padding: 0;
	color: #666;
	/*border: 1px solid #ccc;*/
	font-size: 12px;
	line-height: 1;
	letter-spacing: 0.15em;
	list-style-type: none;
}



#topCont .thumbListArea .thumbBlock a p,

#topCont .thumbListArea .thumbBlock a ul {

	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;

}



#topCont .thumbListArea .thumbBlock a:hover p,

#topCont .thumbListArea .thumbBlock a:hover ul {

	opacity: 0.5;

}


/* @end */

/* @group Design Lab ------------------------------ */

#topCont .designLab {
	width: 340px;
	margin: 0 auto;
	padding: 80px 0 0;
	border-top: 1px solid #ccc;
	text-align: center;
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#articleFoot .designLab a {
	-webkit-transition: all 0.3s ease;
	transition: all 0.3s ease;
}

#topCont .designLab a,
#topCont .designLab a img {
	display: block;
}

#topCont .designLab a img {
	width: 342px;
	height: 20px;
}

#topCont .designLab a:hover {
	opacity: 0.5;
}


/* @end */

br.forSp {
	display: none;
}


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

	/* @group MainVisual ------------------------------ */

	#mainVisual {
		/*height: calc(100vh - 54px);*/

		height: 0;

/* 		padding-top: 129.33333333333%; */
	}

	#mainVisual .visual {
	}

/*
	#mainVisual .visual img {
		width: auto;

		height: 100%;
	}
*/

	#mainVisual .visual h1 img {
		/*width: 40.266666666%;*/
		width: calc(100vw/(750/400));
	}

	/* @end */

	#topCont {
		width: 100%;
		max-width: 768px;
		padding: 42px 20px 50px;
		margin: 0 auto;
		font-family: 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Hiragino Sans', 'ヒラギノ角ゴシック', '游ゴシック', 'Yu Gothic', 'メイリオ', 'Meiryo', sans-serif;
	}

	#topCont h1 {
		height: 0;
		margin: 0 0 13.33333333333%;
		padding: 17.761194% 0 0;
		background-image: url(../images/title_sp.svg);
		background-repeat: no-repeat;
		background-size: auto 100%;
		background-position: 50% 50%;
		text-indent: -999em;
		text-align: left;
	}

	#topCont .description {
		width: 269px;
		/*margin: 0 auto 75px;*/

		margin: 0 auto 45px;
	}

	#topCont .description img {
		display: block;
		width: 100%;
		height: auto;
	}

	/* @group ArticleList ------------------------------ */

	#topCont .thumbListArea {
		position: relative;
		margin: 0 0;
		padding: ;
	}

	/*#topCont .thumbListArea:before {
		content: '';
		display: block;
		width: 80px;
		height: 1px;
		margin: 0 auto 37px;
		background: #ccc;
	}*/


	#topCont .thumbListArea .sortList {
		flex-wrap: wrap;
		width: 320px;
		margin: 0 auto 40px;
		list-style-type: none;
		max-width: 100%;
	}

	#topCont .thumbListArea .sortList li {
		margin: 0 15px 12px;
		padding: 12px 15px;
		font-size: 13px;
		line-height: 1;
	}

	#topCont .thumbListArea .sortList li:hover {
		border-color: transparent;
	}


	#topCont .thumbListArea .sortList li.ac {
		border-color: #000;
	}


	#topCont .thumbListArea .thumbList {
		display: block;
	}

	#topCont .thumbListArea .thumbBlock {
		width: 100%;
		margin: 0 0 37px;
	}

	#topCont .thumbListArea .thumbBlock .thumb {
		margin: 0 0 20px;
	}


	#topCont .thumbListArea .thumbBlock .product {
		margin: 0 0 10px;
		font-size: 18px;
		line-height: 1.6;
	}

	#topCont .thumbListArea .thumbBlock .title {
		margin: 0;
		font-size: 14px;
		line-height: 2;
	}

	#topCont .thumbListArea .thumbBlock .tagList {
		margin: 12px 0 0;
	}

	#topCont .thumbListArea .thumbBlock li {
		margin: 0 12px 5px 0;
		/*padding: 6px 10px 6px 12px;*/
		/*border: 1px solid #ccc;*/
		font-size: 10px;
	}

	/* @end */

	/* @group Design Lab ------------------------------ */

	#topCont .designLab {
		width: 340px;
		margin: 0 auto;
		padding: 0 0 0;
		border: none;
		max-width: 100%;
	}

	#topCont .designLab:before {
		content: '';
		display: block;
		width: 80px;
		height: 1px;
		margin: 0 auto 50px;
		background: #ccc;
	}

	#topCont .designLab a img {
		display: block;
		width: 200px;
		height: auto;
		margin: 0 auto;
		max-width: 100%;
	}

	#topCont .designLab a:hover {
		opacity: 1;
	}


	/* @end */

	br.forSp {
		display: none;
	}

	/* @end */

	br.forSp {
		display: inline;
	}

}

/*-----------------------------------------
2022.2.7 Add
-------------------------------------------*/
.section
{
	margin-bottom: 116px;	
	letter-spacing: .06em;
}

.section .section__ttl
{
	margin: auto;
	font-size: 18px;
	text-align: center;
	font-weight: bold;
	margin-bottom: 80px;
	max-width: 340px;
	padding-top: 80px;
	border-top: 1px solid #ccc;
}

.section .link-list
{
		list-style-type: none;
}

.section .link-list a
{
	color: inherit;
	text-decoration: none;
	transition: all 0.7s ease;
	display: block;
}

.section .link-list a:hover
{
	opacity: .5;
}

@media (min-width: 769px)
{
	.section .link-list
	{
		display: flex;
		display: -webkit-flex;
		justify-content: space-between;
	}

	.section .link-list .link
	{
		width: calc((100% - 50px) / 3);
		margin-right: 25px;
	}

	.section .link-list .link:last-child
	{
		margin-right: 0;
	}
}

@media (max-width: 768px)
{
	.section 
	{
		margin-top: 116px;
	}
	.section .section__ttl
	{
		border-top: none;
		padding-top: 0;
	}
	.section .section__ttl:before
	{
		content: "";
		display: block;
		width: 80px;
		border-bottom: solid 1px #ccc;
		margin: auto;
		margin-bottom: 50px;
	}
	.section .section__ttl
	{
		margin-bottom: 40px;	
	}
	.section .link-list .link:not(:last-child)
	{
		margin-bottom: 40px;	
	}
	.section .link-list .link
	{
		width: 100%;
		font-size: 14px;
	}
}

.section .link-list .link__ttl
{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 8px;
}

.section .link-list .link img
{
	max-width: 100%;
	width: 100%;
}

.section .link-list .link .link__pic
{
	margin-bottom: 26px;
}

.internship-banner
{
	position: fixed;
	right: 0;
	bottom: 20px;
	z-index: 10;
	display: block;
	line-height: 1;
	width: 200px;
}

.internship-banner img
{
	width: 100%;
	vertical-align: bottom;
}

@media (min-width: 769px)
{
	.internship-banner
	{
		right: 20px;
		bottom: 30px;
		width: 262px;
	}
}