@charset "utf-8";

/* slick
--------------------------------------------------------- */
.slide1 { 
	width: auto;
	box-sizing: border-box;
	border: 1px solid #c9caca;
	margin: 0 10px 50px;
}
.slide1 img { 
	width: 100%;
	height :auto;
}

/* top_cols
--------------------------------------------------------- */
.top_cols {
	margin-top: 20px;
}
ul.top_col2 {
	font-size: 0; margin-bottom: 40px;
}
ul.top_col2 li {
	width: 50%; display: inline-block; box-sizing: border-box;
	vertical-align: top; 
}
ul.top_col2 li.c1, ul.top_col2 li.c2, ul.top_col2 li.c3, ul.top_col2 li.c4,
ul.top_col2 li.c5 {
	border-left: 1px solid #c9caca;
}
ul.top_col2 li.c2, ul.top_col2 li.c4,ul.top_col2 li.c6 {
	border-right: 1px solid #c9caca;
}
ul.top_col2 li a {
	text-decoration: none; color: #777;
	display: block; padding: 0 20px;
}
ul.top_col2 li a:hover { text-decoration: none;}

ul.top_col2 li.c1 a div, 
ul.top_col2 li.c2 a div, 
ul.top_col2 li.c3 a div, 
ul.top_col2 li.c4 a div {
	font-size: 26px; 
	color: #777; letter-spacing: 1px;
	padding-left: 10px;
	background: url(../img/arrow_r.png) no-repeat right center;
}
ul.top_col2 li.c1 a div {border-left: 5px solid #ea6fa5;}
ul.top_col2 li.c2 a div {border-left: 5px solid #fabb00;}
ul.top_col2 li.c3 a div {border-left: 5px solid #af8dbd;}
ul.top_col2 li.c4 a div {border-left: 5px solid #d0d90a;}

ul.top_col2 li a div {width: 100%; box-sizing: border-box;}
ul.top_col2 li a img {
	display: block; width: 100%; box-sizing: border-box;
	border: 1px solid #777; margin: 20px 0 10px;
}
ul.top_col2 li a p {
	margin-bottom: 10px;
}
ul.top_col2 li a p.des {
	font-size: 16px;
}
div.top_cols div.cor56 {
	padding-left: 20px;
	border-left: 1px solid #c9caca; border-right: 1px solid #c9caca;
}
div.top_cols div.cor56 p {
	font-size: 26px; 
	color: #777; letter-spacing: 1px;
	padding-left: 10px; 
	border-left: 5px solid #ea6fa5;
}

ul.top_col2 li.c5 a div {position: relative;}
ul.top_col2 li.c5 a div:before {
	content: "";
	background: url(../img/blank.png) no-repeat right center;
	height: 39px;
	width: 43px;
	position: absolute;
	top: calc(50% - 20px);
	right: 20px;
}
ul.top_col2 li.c6 a div {position: relative;}
ul.top_col2 li.c6 a div:before {
	content: "";
	background: url(../img/arrow_r.png) no-repeat right center;
	height: 22px;
	width: 12px;
	position: absolute;
	top: calc(50% - 12px);
	/*right: 20px;*/
	right: 7px;
}

/* お知らせ */
.infoList h2 {
	border-bottom: 1px solid #c9caca;
	padding: 12px 0px 0px; letter-spacing: 4px;
	font-size: 160%; 
}
.infoList h2 p {
	border-bottom: 7px solid #ea6fa5;
	width: 50%; margin-bottom: -3px;
	padding-bottom: 12px;
}
.infoList h2 p.cons {border-bottom: 7px solid #af8dbd;}
.infoList ul {
	margin: 20px 0;
}
.infoList ul li {
	margin-bottom: 20px; vertical-align: middle;
}
.infoList ul.info > li {
	border-bottom: 1px solid #c9caca;
}
/*.infoList ul li > div { display: inline-block; }*/
.infoList ul.info li ul.lr {
	display: table; 
	width: 100%; box-sizing: border-box;
}
.infoList ul.info li ul.lr li {
	display: table-cell; 
	vertical-align: middle;
}
.infoList ul.info li ul.lr li.l {width: 77.28%;}
.infoList ul.info li ul.lr li.r {
	width: 22.72%;text-align: right;
}
.infoList ul.info li ul.lr li.r img {width: calc(100% - 50px); height: auto;}

.infoList ul li p { line-height: 1.6em;}
.infoList ul li p.infoTi {
	font-size: 170%; 
}
.infoList ul li p.infoDa {
	font-size: 100%; padding: 5px 0px;
}
.infoList ul li p.infoDa span.n {color: #ea6fa5;}
.infoList ul li p.infoDa span.s {color: #af8dbd;}
.infoList ul li p.infoDa span.i {color: #d0d90a;}
.infoList ul li p.infoExc {
	font-size: 120%;  line-height: 1.5em;
}
.infoList ul li p.infoBut {text-align: right; padding: 15px 0 2px;}
.infoList ul li p.infoBut a {
	border: 1px solid #ea6fa5;
	color: #ea6fa5;
	font-size: 110%;
	padding: 7px 20px 7px 20px;
}
.infoList ul li p.infoBut.n a {color: #ea6fa5; border: 1px solid #ea6fa5;}
.infoList ul li p.infoBut.s a {color: #af8dbd; border: 1px solid #af8dbd;}
.infoList ul li p.infoBut.i a {color: #d0d90a; border: 1px solid #d0d90a;}

.infoList ul li p.infoBut a:after {
	content: "＞";
	padding-left: 7px;
	font-size: 80%;
}
.infoList ul li img {
	border: 1px solid #c9caca;
}

/* お知らせの一覧 */
div.infoListLink {margin: 40px 0 60px;}
div.infoListLink a {
	border: 1px solid #ea6fa5;
	color: #ea6fa5;
	font-size: 170%; letter-spacing: 4px;
	padding: 8px 50px 8px 20px;
	background: url(../img/arrow_r.png) no-repeat right 10px center;
}

/* 一般消費者サイト */
ul.top_col2cons {
	font-size: 0; margin-bottom: 60px;
}
ul.top_col2cons li {
	width: 50%; display: inline-block; box-sizing: border-box;
	vertical-align: top; 
}
ul.top_col2cons li a {
	text-decoration: none; color: #777 !important;
	display: block; padding: 0 20px;
}
ul.top_col2cons li a:hover { text-decoration: none;}
ul.top_col2cons li a img {
	display: block; width: 100%; box-sizing: border-box;
	border: 1px solid #777; /*margin: 20px 0 10px;*/
}
ul.top_col2cons li a div {position: relative;}
ul.top_col2cons li.bann1 a div:before {
	content: "";
	background: url(../img/blank.png) no-repeat right center;
	height: 39px;
	width: 43px;
	position: absolute;
	top: calc(50% - 20px);
	right: 20px;
}
ul.top_col2cons li.bann2 a div:before {
	content: "";
	background: url(../img/blank.png) no-repeat right center;
	height: 39px;
	width: 43px;
	position: absolute;
	/*top: calc(50% - 2px);*/
	bottom: 10px;
	right: 10px;
}


@media screen and (max-width: 1100px){
	.slide1 { margin: 0 0px 50px;}
	ul.top_col2 li a {padding: 0 20px;}
}
@media screen and (max-width: 970px){
	ul.top_col2 li a, ul.top_col2cons li a {padding: 0 10px;}
	div.top_cols div.cor56 {padding-left: 10px;}
	ul.top_col2 li.c1 a div, ul.top_col2 li.c2 a div, ul.top_col2 li.c3 a div, ul.top_col2 li.c4 a div, div.top_cols div.cor56 p {font-size: 20px;}
	ul.top_col2 li a p.des {font-size: 14px;}
	
	.infoList h2 {font-size: 140%;}
	.infoList ul.info li ul.lr li.r img {width: calc(100% - 30px);}
	.infoList ul li p.infoTi {font-size: 150%; }
	.infoList ul li p.infoDa {font-size: 90%;}
	.infoList ul li p.infoExc {font-size: 100%;}
	.infoList ul li p.infoBut a {font-size: 100%; padding: 5px 10px 5px 10px;}
	div.infoListLink a {font-size: 150%; letter-spacing: 2px; padding: 5px 30px 5px 10px;}
}
@media screen and (max-width: 640px){
	.top_cols {margin-top: 10px;}
	ul.top_col2, ul.top_col2cons { margin-bottom: 10px;}
	ul.top_col2 li, ul.top_col2cons li {width: auto; display: block; }
	ul.top_col2 li a, ul.top_col2cons li a {padding: 0 0px;}
	div.top_cols div.cor56 {padding-left: 0px;}
	ul.top_col2 li.c1, ul.top_col2 li.c2, ul.top_col2 li.c3, ul.top_col2 li.c4,
ul.top_col2 li.c5 {border-left: none;}
	ul.top_col2 li.c2, ul.top_col2 li.c4,ul.top_col2 li.c6 {border-right: none;}
	div.top_cols div.cor56 {border-left: none; border-right: none;}
	
	ul.top_col2 li.c1, ul.top_col2 li.c3 {margin-bottom: 10px;}
	div.infoListLink {margin: 40px 0 40px;}
	
	.infoList ul.info li ul.lr {display: block; }
	.infoList ul.info li ul.lr li {display: block; }
	.infoList ul.info li ul.lr li.l {width: auto;}
	.infoList ul.info li ul.lr li.r {width: auto;}
	.infoList ul.info li ul.lr li.r img {width: 200px;}
	
}
@media screen and (max-width: 550px){
	.infoList h2 {font-size: 140%;  letter-spacing: 2px;}
	.infoList h2 p {width: 70%; }
}
@media screen and (max-width: 350px){
	.infoList h2 p {width: 80%; }
	ul.top_col2 li.c1 a div, ul.top_col2 li.c2 a div, ul.top_col2 li.c3 a div, 
	ul.top_col2 li.c4 a div, div.top_cols div.cor56 p {font-size: 18px;}
}