/* ==========================================================================
   Base
   ========================================================================== */
*,*:after,*:before {
  -moz-box-sizing: inherit;
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}
html {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body{
  /* font 16px/26px */
  font: 16px/26px  Lato, "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  margin:0;
  padding:0;
}
h1{
  font-size:2em;
  line-height:2.1em;
  margin: 0 0 1em 0;
}
.logo-container h1 {
  font-size:0;
  line-height:0;
  margin: 0 0 15px 0;
}
h2{
  font-size:1.5em;
  line-height:1.6em;
  margin: 0 0 0.7em 0;
}
h3{
  font-size: 1.17em;
  line-height:1.27em;
  margin: 0 0 0.6em 0;
}
h4{
  font-size:1em;
  line-height:1.1em;
  margin: 0 0 0.5em 0;
}
h5{
  font-size: 0.83em;
  line-height:0.93em;
  margin: 0 0 0.4em;
}
p{
  margin: 1em 0;
}
img{
  max-width:100%;
}
a{
  text-decoration:none;
}
a:hover{
  text-decoration:underline;
}
dl,dt,dd {
  margin: 0;
}

table{
  width:100%;
  border-collapse: collapse;
}
table td{
  vertical-align:top;
}
@media screen and (max-width:480px) {
  dt,dd {
    text-align: center;
  }
}


/* ==========================================================================
   Layout
   ========================================================================== */
header{
  margin:0;
}
main{
  overflow: hidden;
  padding: 64px 0px;
  margin: 0;
}
footer{
  border-top:5px solid #006698;
  padding:30px 0 0;
  margin:0;
}
.section-1{
  margin: 4em 0;
}
.section-2{
  margin: 3em 0;
}
.section-3{
  margin: 2.3em 0;
}
.section-4{
  margin: 2em 0;
}
.section-5{
  margin: 1.7em 0
}
.section-1:first-child,
.section-2:first-child,
.section-3:first-child,
.section-4:first-child,
.section-5:first-child
{
  margin-top:0;
}
.section-1:last-child,
.section-2:last-child,
.section-3:last-child,
.section-4:last-child,
.section-5:last-child
{
  margin-bottom:0;
}
h2 + p,
h3 + p,
h4 + p,
h5 + p{
  margin-top: 0;
}
@media screen and (max-width:680px) {
  main{
    padding: 32px 0px;
  }
}

/* top
   ----------------------------------------------------------------- */
.l-top{
  position:relative;
  background-size:auto 100%;
  background-position: center;
  background-repeat: no-repeat;
  height:288px;
}
  .l-top.is-annual{
    background-image:url(../img/common/top/annual-top.jpg);
  }
  .l-top.is-ayumi{
    background-image:url(../img/common/top/ayumi-top.png);
  }
  .l-top.is-greeting{
    background-image:url(../img/common/top/greeting-top.jpg);
  }
  .l-top.is-jhpn{
    background-image:url(../img/common/top/jhpn-top.jpg);
  }
  .l-top.is-katsudo{
    background-image:url(../img/common/top/katsudo-top.jpg);
  }
  .l-top.is-member{
    background-image:url(../img/common/top/member-top.png);
  }
  .l-top.is-membership{
    background-image:url(../img/common/top/membership-top.jpg);
  }
  .l-top.is-mission{
    background-image:url(../img/common/top/mission-top.jpg);
  }
  .l-top.is-reports{
    background-image:url(../img/common/top/mission-top.jpg);
  }
  .l-top.is-privacy{
    background-image:url(../img/common/top/privacy-top.jpg);
  }
  .l-top.is-event{
    background-image:url(../img/common/top/event-top.jpg);
  }
  .l-top.is-news{
    background-image:url(../img/common/top/news-top.jpg);
  }
  .l-top.is-payment{
    background-image:url(../img/common/top/payment-top.jpg);
  }
@media screen and (max-width:1200px) {
  .l-top{
    background-size:cover !important;
  }
}
@media screen and (max-width:680px) {
  .l-top{
    height:120px;
  }
}

.l-breadcrumb {
	font-size: 0.8em;
	line-height: 1.5em;
}
/* ==========================================================================
   Module
   ========================================================================== */
.column-date{
  background:rgba(255,255,255,0.8);
}
.date{
  margin:0;
  padding: 0 10px;
  color:black;
  font-size: 0.8em;
  font-weight:bold;
}

/* top-title
   ----------------------------------------------------------------- */
.top-title{
  background:white;
  color:#007f37;
  font-weight:bold;
  text-align:center;
  width: 650px;
  margin:0px auto;
}
  .top-title span{
    width:50%;
    float:left;
    margin-top:120px;
    box-sizing:border-box;
  }
  .top-title .main{
    background:#007f37;
    color:white;
    border:1px solid #fff;
    padding:4px 0px;
  }
  .top-title .sub{
    background:#fff;
    color:#007f37;
    padding:5px 0px;
  }
@media screen and (max-width:680px) {
  .top-title{
    width: 320px;
  }
  .top-title span {
    width: 100%;
    margin-top:24px;
  }
  .top-title .sub {
    margin-top:0px;
  }
}
@media screen and (max-width:430px){
  .top-title .sub{
    margin-top:0;
  }
}

/* magazine-icon
   ----------------------------------------------------------------- */
.magazine-icon{
  /*position:absolute;*/
  position: fixed;
/*
  right:40px;
  top:180px;
  width:120px;
*/
    right: 105px;
    top:auto;
    bottom: -15px;
    width: 100px;
    height: 100px;
  z-index:100;
}
  .magazine-icon a:hover img{
      opacity: 0.75;
  }
@media screen and (max-width:680px) {
  .magazine-icon{
    right: 105px;
    top:auto;
    bottom: -15px;
    width: 100px;
    height: 100px;
  }
}
/* contact-icon
   ----------------------------------------------------------------- */
.contact-icon{
  /*position:absolute;*/
  position: fixed;
/*
  right:40px;
  top: calc( 180px + 130px );
  width:120px;
*/
    right: 0px;
    top:auto;
    bottom: -15px;
    width: 100px;
    height: 100px;
  z-index:100;
}
  .contact-icon a:hover img{
      opacity: 0.75;
  }
@media screen and (max-width:680px) {
  .contact-icon{
    right: 0px;
    top:auto;
    bottom: -15px;
    width: 100px;
    height: 100px;
  }
}


/* social-container
   ----------------------------------------------------------------- */
.social-container{
  float:right;
}
	.social-container a:hover img{
	 opacity: 0.75;
	}
.social-container img{
  margin-left: 10px;
  margin-top: 10px;
  float:left;
}
@media screen and (max-width:680px) {
  .social-container{
    width:100% !important;
    padding-right:25px;
  }
  .social-container img{
    float:right;
  }
}
.button-linkedin{
	float: right;
	margin: 0 0 0 15px;
}	
.button-tw{
	float: right;
	padding: 5px 0 0 0;
}	
.button-fb{
	float: right;
	padding: 5px 0 0 0;
}	






/* pagetop
   ----------------------------------------------------------------- */
#pagetop {
	position: fixed;
	width: 100%;
	bottom: 150px;
	display: none;
}

#pagetop > div {
	max-width: 1200px;
	margin: 0 auto;
	position: relative;
}
#pagetop > div a {
	width: 50px;
	position: absolute;
	right: 0;
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
	z-index: 100;
}
#pagetop a:hover img{
 opacity: 0.75;
}


/* section-title
   ----------------------------------------------------------------- */
.section-title{
  color:#117635;
  font-weight:bold;
  text-align:center;
}
h1.section-title{
  font-size:2.5em;
  font-family:'Calibri';
  border-bottom:2px solid #117635;
  line-height:1em;
  padding: 10px 0;
  margin:0 0 10px 0;
}
@media screen and (max-width:480px) {
  h1.section-title{
    font-size:2.0em;
    line-height: 1.3em;
  }
}
/* green-box
   ----------------------------------------------------------------- */
.green-box {
  border: #117635 solid 1px;
  color: #117635;
  margin:1em 0;
}
.green-box-thick{
  border:2px solid #018038;
  color: #117635;
  margin:1em 0;
}
.green-box-thin{
  border:1px solid #7fbf9b;
  color: #117635;
  margin:1em 0;
}
.green-box.form {
    font-size: 1.5em;
    padding: 5px 0 5px 5px;
}

/* gray-box
   ----------------------------------------------------------------- */
.gray-box{
  background:#e8e8e8;
  padding:6px 15px;
  margin:1em 0;
  font-family: sans-serif, 'MS PGothic', arial, helvetica, 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', "メイリオ", Meiryo, "ＭＳ Ｐゴシック", Osaka;
}

/* katsudo
   ----------------------------------------------------------------- */
.three-column.katsudo{
  height: 300px;
  padding:20px;
  position: relative;
}
	.three-column.katsudo a:hover img{
	 opacity: 0.75;
	}
  .three-column .tag{
    color: white;
    font-size: 0.8em;
    font-weight: bold;
    background:#006698;
    padding: 0px 10px;
    position:absolute;
    top: 30px;
    left: -5px;
    z-index:100;
  }
.katsudo-column-img{
  width: 100%;
  max-height: 100%;
  object-fit: cover;
  position: relative;
}
.column-contents{
  width: calc(100% - 40px);
  position:absolute;
  bottom: 20px;
}
.column-text{
  background:rgba(0,0,0,0.8);
  bottom:0px;
  color:white;
  font-size:0.9em;
  height: 64px;
  padding: 4px 14px;
}
.column-text a{
  color:white;
  font-size:0.9em;
  word-break: break-all;
}

/* 202305追加 */
.three-column .tag.events {
	background: #e7be00;
}
.three-column .tag.research {
	background: #b12546;
}
.three-column .tag.lecture {
	background: #654e99;
}


/* form
   ----------------------------------------------------------------- */
.l-form {
	text-align: center;
}
.l-form form{
	display: inline-block;
}
.common_mail_form {
	display: table;
	text-align: left;
	border-top: #CCC 1px solid;
	border-left: #CCC 1px solid;
	width: 850px;
	max-width: 100%;
	margin: 2% 0 0 0;
}
.common_mail_form input {
	font-size:1.4em;
	padding:1px;
}
.common_mail_form input[name=zip_1]{
	width: 3em;
}
.common_mail_form input[name=zip_2]{
	width: 4em;
}
.common_mail_form textarea {
	font-size:1.4em;
	width:85%;
}
.common_mail_form select {
	font-size:1.4em;
}
.common_mail_form th {
	background: #F2F2F2;
	font-weight: 400;
	border-bottom: #CCC 1px solid;
	border-right: #CCC 1px solid;
	width: 35%;
	padding: 10px;
}
.common_mail_form td {
	border-bottom: #CCC 1px solid;
	border-right: #CCC 1px solid;
	padding: 10px;
}
.common_mail_form .col {
	border-right: none;
	min-width: 8em;
}
.common_mail_form  .small {
	font-size: 0.8em;
}
.common_mail_form .small:before {
	padding-left: 30px;
	content: "";
}
.form_submit {
	color: #FFF;
	font-size: 1.2em;
	text-align: center;
	background: #117635;
	width: 200px;
	padding: 10px 0;
	cursor: pointer;
	border-style: none;
	margin: 0 0 0 300px;
	/* border-radius: 10px; */
	/* -webkit-border-radius: 10px; */
	-moz-border-radius: 10px;
}
.form_submit:hover{
	opacity:0.75;
}

@media screen and (max-width:1200px) {
  /*
  .column-text{
    min-height:89px;
  }*/
}
@media screen and (max-width:960px){
  .column-text{
    /* height: 64px; */
  }
}
@media screen and (max-width:680px) {
  .three-column.katsudo{
    /* padding: 20px; */
    /* margin-bottom:20px; */
    /* margin-top: 20px; */
    width: 100%;
    text-align: center;
    display: inline-block;
    margin-right: 0;
  }
  .three-column .tag{
    left:0;
  }
  .column-contents {
    /*max-width: 400px;*/
    /*width:400px;*/
    /*width:auto;*/
  }

  .common_mail_form,
  .common_mail_form tr,
  .common_mail_form th,
  .common_mail_form td {
    width: 100% !important;
    display: block;
  }
  .common_mail_form tbody {
    display: block;
    width: 100% !important;
  }
  .common_mail_form .col {
    border-right: #CCC 1px solid;
  }
	.common_mail_form input,
	.common_mail_form textarea,
	.common_mail_form select {
	font-size:1.4em;
}
		font-size:1.2em;
	}
	.form_submit {
		margin: 0 auto;
	}
}

/* member-link-container
   ----------------------------------------------------------------- */
.member-link-container .green-box-thin{
  float:left;
  text-align:center;
  padding: 5px 20px;
  margin-right:1em;
}
  .member-link-container .green-box-thin a{
    font-weight:bold;
    color:#007f37;
    display:block;
    padding:4px 0px;
  }
@media screen and (max-width:680px) {
  .member-link-container .green-box-thin{
    width:100%;
    margin: 10px 20px 5px 0px;
  }
}

/* member-detail-title
   ----------------------------------------------------------------- */
.member-detail-title{
  margin-bottom:20px;
}
  .member-detail-title h1{
    color:#666666;
    font-family:'Calibri';
    line-height: 1em;
    border-bottom:1px solid #007f37;
    padding-bottom:10px;
    margin-bottom: 0px;
    width: calc(100% + 40px);
  }
  .member-detail-title h1 span{
    color:#999999;
    font-size:0.8em;
    margin-left:20px;
  }
@media screen and (max-width:480px) {
  .member-detail-title h1{
    font-size:1.9em;
  }
  .member-detail-title h1 span{
    display: block;
  }
}

/* member-sns
   ----------------------------------------------------------------- */
ul.member-sns{
	margin: 0 0 20px 0;
	padding: 0;
	overflow: hidden;
}	
ul.member-sns li{
	float: left;
	margin: 0 15px 0 0;
	list-style: none;
}		
ul.member-sns li img{
	width: 40px;
	height: auto;
	transition: 0.5s ;
}		
ul.member-sns li img:hover{
	opacity: 0.5 ;
}	


/* submenu
   ----------------------------------------------------------------- */
.l-submenu {
  text-align: center;
}
.l-submenu ul{
  list-style-type: none;
  padding-left: 0;
  margin: 2em auto;
  width: 98%;
  border: 2px solid #117635;
  padding: 0.5em 0;
  display: inline-block;
}
.l-submenu li{
  display: inline;
}
.l-submenu a{
  color: #117635;
  font-weight: bold;
  border-right: 1px solid #117635;
  padding: 0 1em;
  font-size: 0.7em;
}
.l-submenu li:last-child a {
  border: none;
}
.l-submenu a:lang(en){
  font-size: 0.8em;
}
@media screen and (max-width:1200px) {
  .l-submenu a{
  }
  .l-submenu a:lang(en){
    padding: 0 0.5em;
  }
}
@media screen and (max-width:960px) {
  .l-submenu ul{
    width: 100%;
  }
}
@media screen and (max-width:732px) {
  .l-submenu{
    display: none;
  }
}
@media screen and (max-width:680px) {
  .l-submenu{
    display: none;
  }
}

/*  office-info
   ----------------------------------------------------------------- */
.office-info{
  min-width: 300px;
  width: 50%;
  margin: 0 10px;
}
.office-info th{
  background: #f7f7f7;
  width: 20%;
  padding: 25px 0;
  border-top: 2px dotted #d8d8d8;
  border-bottom: 2px dotted #d8d8d8;
}
.office-info td{
  padding: 10px;
  border-top: 2px dotted #d8d8d8;
  border-bottom: 2px dotted #d8d8d8;
}
p input,
p select,
p textarea{
  margin: 0 10px;
}

/* container
   ----------------------------------------------------------------- */
.container{
  width:100%;
  max-width:1200px;
  margin-right:auto;
  margin-left:auto;
}
.column-container .four-column {
  padding: 0 65px;
  text-align:center;
}
.four-column{
  width:25%;
  float:left;
}
.column-container .three-column {
  padding: 0 108px;
}
.three-column{
  width:33.3%;
  float:left;
}
.three-column:last-child{
  margin-right:0;
}
.three-column a:hover img{
 opacity: 0.75;
}
.two-third{
  width:calc(75% - 40px);
  margin-right:40px;
  margin-bottom: 40px;
  float:left;
}
.one-third{
  width:25%;
  float:left;
}
@media screen and (max-width:1200px) {
  .container{
    width:90%;
    box-sizing:border-box;
  }
  .column-container .four-column{
    padding:0;
  }
  .column-container .three-column {
    padding: 0 20px;
  }
}
@media screen and (max-width:680px) {
  .container{
    width:95% !important;
  }
  .four-column{
    width:50%;
  }
  .two-third{
    width:100%;
  }
  .one-third{
    width:100%;
    text-align: center;
    margin-bottom:30px;
  }
  .three-column{
    width:50%;
  }
  .column-container .three-column{
    padding:0px;
  }
}
@media screen and (max-width:430px){
  .column-container .four-column{
    width:100%;
  }
}
.container img{
    height: auto;
}
@media screen and (max-width:480px){
  .container img{
    width:100%;
    height: auto;
  }
}




/* column-list 20201019
   ----------------------------------------------------------------- */
.column-list {
	text-align: center;
}
.column-list li{
	box-sizing: border-box;
	display: inline-block;
	vertical-align: top;
	padding: 0 15px;
	width: 48%;
}
.column-list li p.youtube {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
}
.column-list li p.youtube iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width:960px) {
  .column-list{
	  padding: 0 !important;
	  margin: 0 !important;
  }
  .column-list li{
	  display: block;
	  width: 100%;
	  padding: 0 10px;
	  margin: 0 !important;
  }
}
@media screen and (max-width:430px){
  .column-list{
	  padding: 0 !important;
	  margin: 0 !important;
  }
  .column-list li{
	  padding: 0 10px;
	  margin: 0 !important;
  }
}


/* column-list 20201218
   ----------------------------------------------------------------- */
ul.list-report{
	width: 100%;
	overflow: hidden;
	margin: 0 0 50px 0;
}	
ul.list-report li{
	width: 50%;
	float: left;
	font-size: 16px;
}
@media screen and (max-width:960px) {
  ul.list-report li{
	  width: 100%;
	  float: none;
	  margin: 0 0 10px 0;
  }
}

/* requestボタン 20210726
   ----------------------------------------------------------------- */
.requestBtn{
	text-align: center;
}
.requestBtn span {
	display: inline-block;
}
@media screen and (min-width:431px){
	.requestBtn span {
		display: block;
		width: 250px;
		margin: 0 auto;
	}
}

.requestBtn a {
	color: #fff;
	display: block;
	padding: 10px 30px;
	cursor: pointer;
	transition: all 0.3s ease 0s;
}
.requestBtn a:hover {
	opacity: 0.6;
	text-decoration: none;
}
.requestBtn.green a {
	background-color: #0f7e42;
}
.requestBtn.blue a {
	background-color: #0099CB;
}
.requestBtn.orange a {
	background-color: #FF9900;
}
   

/* ==========================================================================
   utility
   ========================================================================== */
.u-font-calibri{
  font-family:'Calibri';
}
.green-text{
  color:#117635;
}
.light-blue-text{
  color:#0099cc;
}
.bold-text{
  font-weight:bold;
}
.font-size-s{
  font-size:0.83em;
}
.font-size-l{
  font-size:1.17em;
}
.center{
  text-align:center;
}
.overflow{
  overflow: hidden;
}
.u-ta-right{
  text-align :right;
}

/* clearfix
   ----------------------------------------------------------------- */
.clear{
  clear: both;
}
.clearfix {
  min-height: 1px;
}
.clearfix:after {
  display:block;
  clear:both;
  height:0px;
  visibility:hidden;
  content:".";
}
* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}


/* 画像フロート
   ----------------------------------------------------------------- */
.container img.aligncenter {
    display: block;
    margin: 0px auto 0;
    text-align: center; 
}
.container img.alignleft {
    display: block;
    float: left;
    padding-right: 25px;
    padding-bottom: 25px;
}
.container img.alignright {
    display: block;
    float: right;
    padding-left: 25px; 
    padding-bottom: 25px;
}


/* タグ説明文 20221117
   ----------------------------------------------------------------- */
.tag-description{
	width: 100%;
	max-width: 1160px;
	margin: 30px auto 0;
	padding: 15px 30px;
	box-sizing: border-box;
	border: 1px solid #ccc;
}
.tag-description h2{
	color: #007f37;
}
.tag-description p{
  font-size:14px;
  line-height: 1.5;
}
.tag-description p a{
	text-decoration: underline;
}
@media screen and (max-width:1160px) {
  .tag-description{
	  width: 90%;
	  margin: 20px auto 0;
  }
}


/* 印刷時非表示設定
   ----------------------------------------------------------------- */
@media print {
  .magazine-icon,
  .contact-icon{
    display: none;
  }
  #pagetop {
	  visibility: hidden;
	  }
}

