@charset "utf-8";

/* =========================================== */
/* 基礎枠
/* =========================================== */
/*  */

/* =========================================== */

#wrapper{
	width:1000px;
	margin:0 auto;
}
#wrapper2{
	width:1000px;
	margin:0 auto;
}
/* =========================================== */
/* ヘッダー
/* =========================================== */
/*  */

/* =========================================== */


/*　　ヘッダー全体　　*/
#header{
	width:1000px;
	height:100px;
	justify-content: space-between;
	margin: 0 auto;
	display: flex;
}
#header.line_header {
	width: 100%;
	height: 100px;
	border-bottom: 2px solid #eee;
}
#header_inner {
	width:1000px;
	justify-content: space-between;
	margin: 0 auto;
	display: flex;
}
div#header_logo{
	width: 300px;
	margin: 30px 0;
}

/*　　ナビゲーションエリア　　*/

nav{
    width:650px;
	margin-left: 78px;
	align-items: center;
}
ul#topnav{
	display: flex;
	flex-wrap: nowrap;
	align-items: center; 
}
ul#topnav li{
	display: block;
    width:150px;
	font-size: 14px;
	text-align: center;
	padding: 43px 0;
}
ul#topnav li a{
	text-decoration: none;
	text-align: center;
	color:#333;
}
ul#topnav li:hover{ 
	background: #eee;
    cursor:pointer; }

/*--------*/
ul#topnav li.contact{
	display: block;
	width:200px;
	font-size: 14px;
	text-align: center;
	padding: 30px 0 30px;
	background: #2889cd;line-height:1.5em;
}
ul#topnav li.contact a{
	text-decoration: none;
	text-align: center;
	color:#FFF;
}
ul#topnav li.contact:hover{ 
	background: #FF9900;
	color:#333;
    cursor:pointer; }
ul#topnav li.contact a:hover{
	color:#333;
}


/*　　pagetop　　*/

.pagetop {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
	margin-top: 200px;
}
.pagetop .box-title {
    position: absolute;
    display: inline-block;
    top: -16px;
    right: -3px;
    padding: 0 9px;
	width: 100px;
    height: 30px;
    line-height: 30px;
	text-align: center;
    vertical-align: bottom;
    font-size: 12px;
    background: #8a9edc;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.pagetop .box-title a{
    color: #ffffff;
	text-decoration: none;
}

/*　　footerリンク　　*/

.link_button {
	text-align: center;
	margin-top: 100px;
	color:#0570b8;
	margin-bottom: -150px;
}
p.link_button a{
	text-decoration: none;
	color: #333;
}
p.link_button a:hover{
	color:#0570b8;
}

/*　　footer　　*/

footer {
	width: 100%;
	height: 150px;
	background: #0570b8;
	border-top: 5px solid #8a9edc;
	margin-top: -30px;
}
.footer_inner {
	width: 1000px;
	margin: 0 auto;
	color: #fff;
	text-align: center;
}
.footer_inner p{
	font-size: 14px;
	padding: 30px 0;
	line-height: 1.6;
}
.footer_inner a {
	text-decoration: none;
	color: #fff;
}
.footer_inner a:hover {
    color:#8a9edc;
}


/* =======================================
    トップ・一覧
======================================= */


/*　　メイン画像　　*/

#mainimg {
	position: relative;
	width:1200px;
	margin: 0 auto;
}

#main_slide ul {
    margin: 0 auto;
	width: 1200px;
	height: 600px;
}
#main_slide ul li {
    display: none;
    overflow: hidden;
}
#main_slide ul li.main1 {
	z-index: 1;
	position: absolute;
}
#main_slide ul li.main2 {
	z-index: 2;
	position: absolute;
}
#main_slide ul li.main3 {
	z-index: 3;
	position: absolute;
}

@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.youto p{
	text-indent: -6em;
	line-height: 1.2;
	font-size: 18px;
	font-weight: bold;
	border-bottom: 2px solid #0870b7;
	padding: 40px 0 10px 0;
	padding-left:6em;
}
.youto p:before {
    content: '';
    display: inline-block;
    width: .5em;
    height: .5em;
    margin-right: .5em;
    background: #333;
    transform: rotate(45deg);
    vertical-align: 2px;
}

#product, #purpose {
	margin: 30px 0;
}

.three_box {
	width: 1000px;
	display: flex;
	flex-wrap: wrap;
	padding: 10px;
	justify-content: center;
}
.two_box {
	width: 1000px;
	display: flex;
	flex-wrap: wrap;
	padding: 10px;
	justify-content: center;
/*	margin-left: 145px; */
}
.three_box .box {
  width: calc(33.3% - 10px);
	margin:5px;
}
.two_box .box {
  width: calc(33.3% - 10px);
	margin: 5px;
}
.box_outer {
	margin-left: -32px;
}
.box a:hover{
	opacity: 0.7;
}


#news{
  height:auto;
  background-color:#ffffff;
  margin-bottom:80px;
  padding:30px 0 30px;
}
#news h2{
  text-align:center;

}
#news ul{
  font-size:1.2em;
  width:950px;
  margin:20px auto;
  display:block;
  padding:0.5em;
  list-style-type:none;
}
#news ul li{
  margin-bottom:1em;
  position:relative;
  padding: 0em 0.3em 0.3em 1.3em;
  line-height:1.2em;
  border-bottom: 1px dashed #CCC;
}

#news ul li::before {
	position:absolute;
	content:'';
	top: 0.2em;
	left: 0.2em;
	height:0;
	width:0;
	border-style: solid;
	border-width: 6px 0 6px 9px;
	border-color: transparent transparent transparent #3F51B5;
}
/*　　見出し　　*/

.transparent-bothends {
    position: relative;
    width: 100%;
    margin: 50px 0;
    padding: 10px 0;
    color: #333;
    font-size: 26px;
	font-weight: bold;
    text-align: center;
}
.transparent-bothends::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 70%;
    height: 5px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #0570b8 25%, #0570b8 55%, transparent);
    background-image: linear-gradient(to right, transparent, #0570b8 25%, #0570b8 55%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}
.calmar_txt {
	padding: 0 60px;
	font-size: 18px;
	line-height: 1.8em;
}

/*　　ボタン　　*/
#calmar .youtube_outer{
	display: flex;
	width: 1000px;
	text-align: center;
	padding: 40px 0 30px 0;
}
#calmar .youtube{
    align-items: center;
	display: inline;
	margin: 0 auto;
}
.youtube a{
  width: 240px;
  padding:20px;
  color:#ffffff;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  text-decoration: none;
  background: #FF0000;
  border: 4px solid #FF0000;
  -webkit-box-shadow:0px 0px 0px 1px #ffffff inset;
  -moz-box-shadow:0px 0px 0px 1px #ffffff inset;
  box-shadow:0px 0px 0px 1px #ffffff inset;
  display: block;
  position:relative;
  -webkit-transition: 0.3s ease-out;
  -moz-transition: 0.3s ease-out;
  -o-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.youtube a:hover{
  color:#FF0000;
  background: #ffffff;
}
.members a:hover::before{
  border-top: solid 2px #8a9edc;
  border-right: solid 2px #8a9edc;
}

/* =======================================
    トップ・一覧
======================================= */
/* 商品ページ */

#detail_main {
	display: flex;
	margin-top: 40px;
}
#detail_main p{
	line-height: 1.6;
}
.detail_txt {
	padding-top: 40px;
}
.detail_txt p{
	font-size: 16px;
	margin-left: -50px;
	padding-top: 5px;
}
.detail_title {
	position: relative;
	padding-left: 10px;
	font-size: 30px;
	font-weight: bold;
	line-height: 1.2;
}
.detail_title:after {
	width: 550px;
	margin-bottom: 10px;
	content: "";
	display: block;
	height: 4px;
background: -webkit-linear-gradient(left, rgb(5, 112, 184), transparent);
background: -o-linear-gradient(left, rgb(5, 112, 184), transparent);
background: linear-gradient(to right, rgb(5, 112, 184), transparent);
}

.detail_container {
	/*display: flex;*/
	flex-wrap: wrap;
}

.detail_box {
	 display: flex;
	padding-top: 40px;
}
.detail_box_bottomline {
    position: relative;
    width: 100%;
    margin: 10px 0;
    padding: 10px 0;
    text-align: center;
}
.detail_box_bottomline::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 70%;
    height: 5px;
    margin: 0 auto;
    text-align: center;
    background-image: -webkit-linear-gradient(left, transparent, #0570b8 25%, #0570b8 55%, transparent);
    background-image: linear-gradient(to right, transparent, #0570b8 25%, #0570b8 55%, transparent);
    background-position: center;
    background-repeat: no-repeat;
}

/* */
.detail_color1 {
	 display: flex;
	width: 310px;
	padding-top: 10px;
}
.detail_color1 li {
	width: 100px;
	display: inline-block;
    list-style-type: none;
    text-align: center;
}
.detail_color1 img{
	width: 92px !important;
	height: 92px !important;
	border: 2px solid #ccc;
	margin-right: 12px;
}
.detail_color1 p{
	text-align: center;
}
	/* */
	.detail_color2 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color2 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color2 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color2 p{
		text-align: center;
	}
	/* */
	.detail_color3 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color3 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color3 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color3 p{
		text-align: center;
	}
	/* */
	.detail_color4 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color4 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color4 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color4 p{
		text-align: center;
	}
	/* */
	.detail_color5 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color5 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color5 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color5 p{
		text-align: center;
	}
	/* */
	.detail_color6 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color6 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color6 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color6 p{
		text-align: center;
	}
	/* */
	.detail_color7 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color7 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color7 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color7 p{
		text-align: center;
	}
	/* */
	.detail_color8 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color8 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color8 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color8 p{
		text-align: center;
	}
	/* */
	.detail_color9 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color9 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color9 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color9 p{
		text-align: center;
	}
	/* */
	.detail_color10 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color10 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color10 img{
		width: 92px !important;
		height: 92px !important;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color10 p{
		text-align: center;
	}
	/* */
	.detail_color11 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color11 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color11 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color11 p{
		text-align: center;
	}
	/* */
	.detail_color12 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color12 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color12 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color12 p{
		text-align: center;
	}
	/* */
	.detail_color13 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color13 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color13 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color13 p{
		text-align: center;
	}
	/* */
	.detail_color14 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color14 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color14 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color14 p{
		text-align: center;
	}
	/* */
	.detail_color15 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color15 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color15 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color15 p{
		text-align: center;
	}
	/* */
	.detail_color16 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color16 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color16 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color16 p{
		text-align: center;
	}
	/* */
	.detail_color17 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color17 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color17 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color17 p{
		text-align: center;
	}
	/* */
	.detail_color18 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color18 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color18 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color18 p{
		text-align: center;
	}
	/* */
	.detail_color19 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color19 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color19 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color19 p{
		text-align: center;
	}
	/* */
	.detail_color20 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color20 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color20 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color20 p{
		text-align: center;
	}
	/* */
	.detail_color21 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color21 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color21 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color21 p{
		text-align: center;
	}
	/* */
	.detail_color22 {
		 display: flex;
		width: 310px;
		padding-top: 10px;
	}
	.detail_color22 li {
		width: 100px;
		display: inline-block;
    		list-style-type: none;
    		text-align: center;
}
	.detail_color22 img{
		width: 92px;
		height: 92px;
		border: 2px solid #ccc;
		margin-right: 12px;
	}
	.detail_color22 p{
		text-align: center;
	}


span.color_txt {
	margin-left: -10px;
	line-height: 1.6;
}


.detail_left1 img {
	border: 2px solid #ccc;
	width: 300px;
	height: 300px;
}
	.detail_left2 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left3 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left4 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left5 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left6 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left7 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left8 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left9 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left10 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left11 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left12 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left13 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left14 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left15 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left16 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left17 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left18 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left19 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left20 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left21 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}
	.detail_left22 img {
		border: 2px solid #ccc;
		width: 300px;
		height: 300px;
	}



.detail_right {
	padding-left: 50px; 
	width: 700px;
}
.detail_right h3 {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.6;
	border-bottom: 2px solid #ccc;
	margin-bottom: 10px;
}
.detail_right h4 {
	font-size: 16px;
	line-height: 1.4;
	font-weight: bold;
	padding: 5px 0 5px;
}
.detail_right p{
	font-size: 16px;
}
.detail_right p {
	text-indent:1em;
	margin-bottom: 10px;
}

h3.detail_img_box_h3 {
  width:100%;
	font-size: 18px;
	font-weight: bold;
	border-bottom: 2px solid #ccc;
	margin: 40px auto 20px;
}

.detail_img_box{
  width:100%;
  height:auto;
  display:flex;
  margin-bottom:40px;
  text-align:center;
  font-size:0.97em;
  line-height:1.2em;
}

.detail_img_box .img_box_bottle{
    width:22%;
    margin-right:10px;
}
.detail_img_box .img_box_bottle img{
    width:100%;
}
.detail_img_box .img_box_bottle-1{
    width:45%;
    margin-right:10px;
}
.detail_img_box .img_box_bottle img{
    width:100%;
}
h2.bottle_h2{
  margin-top:80px;

}
h3.detail_img_box_h3-2 {
	position: relative;
	padding-left: 10px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.6em;
	margin:30px auto 10px;
	background-image:url(../images/pentagon.gif);
	background-repeat: no-repeat;
	text-indent: 1em;
}
p.ju_txt {
	padding: 40px 30px;
	font-size: 18px;
	line-height: 1.8em;
}
.detail_img_box2{
  width:auto;
  padding-left:40px;
  display:flex;
  margin: 10px auto 40px;
  text-align:center;
  font-size:0.97em;
  line-height:1.2em;
}
.detail_img_box2 .img_box_bottle2{
    width:auto;
    height:200px;
    margin-right:15px;
}
.detail_img_box2 .img_box_bottle2 img{
    width:auto;
    height:200px;
}

/*　　用語集　　*/

#terms h2 {
	position: relative;
	padding-left: 10px;
	font-size: 22px;
	font-weight: bold;
	line-height: 1.6em;
	margin:30px auto 10px;
	background-image:url(../images/pentagon.gif);
	background-repeat: no-repeat;
	text-indent: 1em;
}
#terms h2:after {
	width: 550px;
	margin-bottom: 10px;
	content: "";
	display: block;
	height: 4px;
background: -webkit-linear-gradient(left, rgb(5, 112, 184), transparent);
background: -o-linear-gradient(left, rgb(5, 112, 184), transparent);
background: linear-gradient(to right, rgb(5, 112, 184), transparent);
}

#terms p{
	/*text-indent: 1em;*/
	line-height: 1.8em;
	font-size: 16px;
	padding:0 20px;
	margin-bottom:30px;
}

/* ------------------------------------- */
.cate_main {
	align-content: flex-start;
	  width: calc(50% - 10px);
}
/* ------------------------------------- */
/*　　メンバーページ　　*/
#contents .members_outer{
	display: flex;
	width: 1000px;
	text-align: center;
	padding: 40px 0 30px 0;
}
#contents .members{
    align-items: center;
	display: inline;
	margin: 0 auto;
}
.members a{
  width: 240px;
  padding:20px;
  color:#ffffff;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  text-decoration: none;
  background: #8a9edc;
  border: 4px solid #8a9edc;
  -webkit-box-shadow:0px 0px 0px 1px #ffffff inset;
  -moz-box-shadow:0px 0px 0px 1px #ffffff inset;
  box-shadow:0px 0px 0px 1px #ffffff inset;
  display: block;
  position:relative;
  -webkit-transition: 0.3s ease-out;
  -moz-transition: 0.3s ease-out;
  -o-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.members a:hover{
  color:#8a9edc;
  background: #ffffff;
}
.members a:hover::before{
  border-top: solid 2px #8a9edc;
  border-right: solid 2px #8a9edc;
}
p.member_txt{
    text-align: center;
	margin-top: -20px;
	line-height: 1.4;
}


/* ------------------------------------- */
#contents .pdf_outer{
	display: flex;
	width: 1000px;
	text-align: center;
	padding: 20px 0 0px 0;
}
#contents .pdf{
    align-items: center;
	display: inline;
	margin: 0 auto;
}
.pdf a{
  width: 240px;
  padding:20px;
  color:#ffffff;
  font-size: 18px;
  line-height: 120%;
  text-align: center;
  text-decoration: none;
  background: #cc3333;
  border: 4px solid #cc3333;
  -webkit-box-shadow:0px 0px 0px 1px #ffffff inset;
  -moz-box-shadow:0px 0px 0px 1px #ffffff inset;
  box-shadow:0px 0px 0px 1px #ffffff inset;
  display: block;
  position:relative;
  -webkit-transition: 0.3s ease-out;
  -moz-transition: 0.3s ease-out;
  -o-transition: 0.3s ease-out;
  transition: 0.3s ease-out;
}
.members a:hover{
  color:#8a9edc;
  background: #ffffff;
}
.members a:hover::before{
  border-top: solid 2px #8a9edc;
  border-right: solid 2px #8a9edc;
}