@charset "utf-8";




/* topics_lnavi
------------------------------------------------ */
ul#topics_lnavi{
	margin:0 auto 60px;
}
ul#topics_lnavi li{
	width:calc(16.66% - 0.833px);
	margin-right:1px;
	margin-bottom:1px;
}
ul#topics_lnavi li:nth-child(10),
ul#topics_lnavi li:nth-child(11){
	width:calc(25% - 0.75px);
}
ul#topics_lnavi li:nth-child(6),
ul#topics_lnavi li:nth-child(11){
	margin-right:0;
}
ul#topics_lnavi li a{
	width:100%;
	display:block;
	padding:9px 10px 7px;
	color:#fff;
	font-size:20px;
	text-align:center;
	white-space:nowrap;
	background-color:#0064c8;
	transition:all 0.3s linear;
}
body.c1 ul#topics_lnavi li:nth-child(2) a,
body.c2 ul#topics_lnavi li:nth-child(3) a,
body.c3 ul#topics_lnavi li:nth-child(4) a {background-color: #ff6400;}

ul#topics_lnavi li a:hover{
	background-color:#ff6400;
}
ul#topics_lnavi.c1 li:nth-child(2) a,
ul#topics_lnavi.c2 li:nth-child(3) a,
ul#topics_lnavi.c3 li:nth-child(4) a ,
ul#topics_lnavi.c4 li:nth-child(5) a,
ul#topics_lnavi.c5 li:nth-child(6) a,
ul#topics_lnavi.c6 li:nth-child(7) a,
ul#topics_lnavi.c7 li:nth-child(8) a,
ul#topics_lnavi.c8 li:nth-child(9) a,
ul#topics_lnavi.c9 li:nth-child(10) a,
ul#topics_lnavi.c10 li:nth-child(11) a{background-color:#ff6400;}


@media screen and (max-width:1054px){
	ul#topics_lnavi li{
		width:calc(25% - 1.3px);
	}
	ul#topics_lnavi li:nth-child(10),
	ul#topics_lnavi li:nth-child(11){
		width:calc(37.5% - 1.5px);
	}
	ul#topics_lnavi li:nth-child(6n){
		margin-right:1px;
	}
	ul#topics_lnavi li:nth-child(4n){
		margin-right:0;
	}
	ul#topics_lnavi li a{
		font-size:18px;
	}
}
@media screen and (max-width:720px){
	ul#topics_lnavi li a{
		font-size:16px;
	}
}
@media screen and (max-width:660px){
	ul#topics_lnavi {
		margin: 0 auto 30px;
	}
	ul#topics_lnavi li {
		width: calc(33.33% - 0.66px);
		margin-bottom:1px;
	}
	ul#topics_lnavi li:nth-child(10),
	ul#topics_lnavi li:nth-child(11){
		width:calc(50% - 0.5px);
	}
	ul#topics_lnavi li:nth-child(4n){
		margin-right:1px;
	}
	ul#topics_lnavi li:nth-child(3n){
		margin-right:0;
	}
	ul#topics_lnavi li a{
		font-size:14px;
	}
}
@media screen and (max-width:420px){
	ul#topics_lnavi li {
		width: calc(50% - 0.5px);
		margin-bottom:1px;
	}
	ul#topics_lnavi li:nth-child(11){
		width:100%;
	}
	ul#topics_lnavi li:nth-child(3n){
		margin-right:1px;
	}
	ul#topics_lnavi li:nth-child(2n){
		margin-right:0;
	}
	ul#topics_lnavi li a{
		font-size:12px;
	}
}


/* topics_list
------------------------------------------------ */
div#topics_list{
	margin-bottom:0;
}
h2#pttl:before,
div#topics_list ul.pickup li span:before,
div#topics_list ul.list li:before{
	width:9em;
	position:absolute;
	top:15px;
	left:10em;
	display:block;
	padding:2px 0 0;
	color:#fff;
	text-align:center;
	letter-spacing:normal;
	border-radius:10px;
	-webkit-border-radius:10px;
	-moz-border-radius:10px;
	-ms-border-radius:10px;
}
div#topics_list ul.pickup li span:before{
	top:auto;
	left:0;
	bottom:0;
	border-radius:0 10px 0 0;
	-webkit-border-radius:0 10px 0 0;
	-moz-border-radius:0 10px 0 0;
	-ms-border-radius:0 10px 0 0;
}

div#topics_list ul.pickup li span.date:before,
div#topics_list ul.list li span.date:before{
	position:static;
	display:none;
}
ul.list li span.date{
	width: 20em;
}
ul.list li a,
ul.list li span.text {
  width: calc(100% - 20em);
}
@media screen and (max-width:960px){
	ul.list li span.date {
		width: calc(100% - 25px);
		margin-bottom:15px;
	}
	ul.list li a,
	ul.list li span.text {
		width: 100%;
	}
}
@media screen and (max-width:540px){
	h2#pttl::before,
	div#topics_list ul.pickup li span::before,
	div#topics_list ul.list li::before {
		left: auto;
		right:0;
	}
}
@media screen and (max-width:350px){
	h2#pttl::before,
	div#topics_list ul.pickup li span::before,
	div#topics_list ul.list li::before {
		width:7em;
	}
}



/* detail_page
----------------------------------------------------------- */
h2#pttl{
	width:100%;
	position:relative;
	margin:0 auto 60px;
	padding:0 0 15px 4.5em;
	color:#26407b;
	font-size:32px;
	border-bottom:1px #ccc solid;
}
h2#pttl:before{
	top:0.9em;
	left:0;
	font-size:14px;
}
div#topics_text{
	margin:0 auto;
	overflow:hidden;
}
div#gallery{
	margin:90px auto 0;
}
div#gallery img{
	display: block;
	margin: 0 auto;
}
@media screen and (max-width:680px){
	h2#pttl {
		padding: calc(1em + 19px) 0 0 0;
	}
	div#gallery {
		margin: 60px auto 0;
	}
}
@media screen and (max-width:350px){
	div#gallery {
		margin: 30px auto 0;
	}
}

/* topics_icon
----------------------------------------------------------- */
h2#pttl.topics:before,
div#topics_list ul.pickup li.topics span:before,
div#topics_list ul.list li.topics:before  {content:"お知らせ";background-color:#9e944e;}
h2#pttl.event:before,
div#topics_list ul.pickup li.event span:before,
div#topics_list ul.list li.event:before{content:"イベント";background-color:#9f6451;}
h2#pttl.seminars:before,
div#topics_list ul.pickup li.seminars span:before,
div#topics_list ul.list li.seminars:before{content:"講習会";background-color:#648150;}
h2#pttl.workship:before,
div#topics_list ul.pickup li.workship span:before,
div#topics_list ul.list li.workship:before{content:"研修会";background-color:#648150;}
h2#pttl.news:before,
div#topics_list ul.pickup li.news span:before,
div#topics_list ul.list li.news:before{content:"新着情報";background-color:#648150;}
h2#pttl.consulting:before,
div#topics_list ul.pickup li.consulting span:before,
div#topics_list ul.list li.consulting:before{content:"相談";background-color:#648150;}
h2#pttl.recruiting:before,
div#topics_list ul.pickup li.recruiting span:before,
div#topics_list ul.list li.recruiting:before{content:"募集";background-color:#648150;}
h2#pttl.information:before,
div#topics_list ul.pickup li.information span:before,
div#topics_list ul.list li.information:before{content:"情報提供";background-color:#648150;}
h2#pttl.press:before,
div#topics_list ul.pickup li.press span:before,
div#topics_list ul.list li.press:before{content:"プレスリリース";background-color:#648150;}
h2#pttl.download:before,
div#topics_list ul.pickup li.download span:before,
div#topics_list ul.list li.download:before{content:"ファイルダウンロード";background-color:#648150;}


/* seminar_form
----------------------------------------------------------- */
div#seminar_form {
	margin:30px auto
}
div#seminar_form p.coution {
	margin:5px auto 30px;
	text-align:center;
	font-size:14px
}
div#seminar_form .submit {
	clear: both;
	padding: 20px;
	text-align: center;
	background: #ebebeb;
}
div#seminar_form .submit input.button{
	display:inline-block;
	margin-bottom:0;
	font-size:16px;
	letter-spacing:normal;
}