@charset "utf-8";

/****************
news,archive
****************/
main{
background-color: #ededed;
}
#gnav ul li{
width: calc(100% / 4);
}
/*Color*/
/****************
co-creation
****************/
#co-creation #scn_mimg {
background-image: url(../images/mi_bgreen.png);
}
#co-creation #scn_mimg::after {
background-image: url(../images/co-creation/main.png);
}
#co-creation main{
background-color: #b6d6c1;
}
#co-creation #scn_mimg h2{
color: #127733;
}
#co-creation .subnav{
background-color: #127733;
}
#co-creation .subnav li a{
color: #fff;
}
#co-creation .subnav li a:hover,
#co-creation .subnav li.current a{
color: #127733;
}
#co-creation h3{
border-color: #127733;
}
#co-creation h3::before,
#co-creation h3::after{
background-color:#127733;
}
#co-creation .linkbtn{
border-color: #127733;
}
#co-creation .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_green.svg);
}
#co-creation .linkbtn:hover{
background-color: #b6d6c1;
}
#co-creation .larrow dt::before{
border-left: 8px solid #127733;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#co-creation.archive main {
background-color: #ededed;
}
#co-creation.archive .subnav {
background-color: #5f6666;
}
#co-creation.archive .subnav li a{
color: #fff;
}
#co-creation.archive .subnav li a:hover,
#co-creation.archive .subnav li.current a{
color: #5F6666;
}
#co-creation.archive h3{
border-color: #5F6666;
}
#co-creation.archive h3::before,
#co-creation.archive h3::after{
background-color:#5F6666;
}
#co-creation.archive .linkbtn{
border-color: #5F6666;
}
#co-creation.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#co-creation.archive .linkbtn:hover{
background-color: #ededed;
}
#co-creation.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}
#co-creation ul.list li::before{
		border-left: 8px solid #127733;
}

/****************
funding
****************/
#funding #scn_mimg {
background-image: url(../images/mi_borange.png);
}
#funding #scn_mimg::after {
background-image: url(../images/funding/main.png);
}
#funding main{
background-color: #f4d6b2;
}
#funding #scn_mimg h2{
color: #de7700;
}
#funding .subnav{
background-color: #de7700;
}
#funding .subnav li a{
color: #fff;
}
#funding .subnav li a:hover,
#funding .subnav li.current a{
color: #de7700;
}
#funding h3{
border-color: #de7700;
}
#funding h3::before,
#funding h3::after{
background-color:#de7700;
}
#funding .linkbtn{
border-color: #de7700;
}
#funding .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_orange.svg);
}
#funding .linkbtn:hover{
background-color: #f4d6b2;
}
#funding .larrow dt::before{
border-left: 8px solid #de7700;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#funding.archive main {
background-color: #ededed;
}
#funding.archive .subnav {
background-color: #5f6666;
}
#funding.archive .subnav li a{
color: #fff;
}
#funding.archive .subnav li a:hover,
#funding.archive .subnav li.current a{
color: #5F6666;
}
#funding.archive h3{
border-color: #5F6666;
}
#funding.archive h3::before,
#funding.archive h3::after{
background-color:#5F6666;
}
#funding.archive .linkbtn{
border-color: #5F6666;
}
#funding.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#funding.archive .linkbtn:hover{
background-color: #ededed;
}
#funding.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}
/****************
st_information
****************/
#st_information #scn_mimg {
background-image: url(../images/mi_bblue.png);
}
#st_information #scn_mimg::after {
background-image: url(../images/st_information/main.png);
}
#st_information main{
background-color: #bcc1df;
}
#st_information #scn_mimg h2{
color: #22349a;
}
#st_information .subnav{
background-color: #22349a;
}
#st_information .subnav li a{
color: #fff;
}
#st_information .subnav li a:hover,
#st_information .subnav li.current a{
color: #22349a;
}
#st_information h3{
border-color: #22349a;
}
#st_information h3::before,
#st_information h3::after{
background-color:#22349a;
}
#st_information .linkbtn{
border-color: #22349a;
}
#st_information .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_blue.svg);
}
#st_information .linkbtn:hover{
background-color: #bcc1df;
}
#st_information .larrow dt::before{
border-left: 8px solid #22349a;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#st_information.archive main {
background-color: #ededed;
}
#st_information.archive .subnav {
background-color: #5f6666;
}
#st_information.archive .subnav li a{
color: #fff;
}
#st_information.archive .subnav li a:hover,
#st_information.archive .subnav li.current a{
color: #5F6666;
}
#st_information.archive h3{
border-color: #5F6666;
}
#st_information.archive h3::before,
#st_information.archive h3::after{
background-color:#5F6666;
}
#st_information.archive .linkbtn{
border-color: #5F6666;
}
#st_information.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#st_information.archive .linkbtn:hover{
background-color: #ededed;
}
#st_information.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}
/****************
link1
****************/
#link1 #scn_mimg {
background-image: url(../images/mi_byellow.png);
}
#link1 #scn_mimg::after {
background-image: url(../images/link1/main.png);
}
#link1 main{
background-color: #ffefb3;
}
#link1 #scn_mimg h2{
color: #ffcc00;
}
#link1 .subnav{
background-color: #ffcc00;
}
#link1 .subnav li a{
color: #fff;
}
#link1 .subnav li a:hover,
#link1 .subnav li.current a{
color: #ffcc00;
}
#link1 h3{
border-color: #ffcc00;
}
#link1 h3::before,
#link1 h3::after{
background-color:#ffcc00;
}
#link1 .linkbtn{
border-color: #ffcc00;
}
#link1 .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_yellow.svg);
}
#link1 .linkbtn:hover{
background-color: #ffefb3;
}
#link1 .larrow dt::before{
border-left: 8px solid #ffcc00;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#link1.archive main {
background-color: #ededed;
}
#link1.archive .subnav {
background-color: #5f6666;
}
#link1.archive .subnav li a{
color: #fff;
}
#link1.archive .subnav li a:hover,
#link1.archive .subnav li.current a{
color: #5F6666;
}
#link1.archive h3{
border-color: #5F6666;
}
#link1.archive h3::before,
#link1.archive h3::after{
background-color:#5F6666;
}
#link1.archive .linkbtn{
border-color: #5F6666;
}
#link1.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#link1.archive .linkbtn:hover{
background-color: #ededed;
}
#link1.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}
/****************
archive
****************/
#archive #scn_mimg {
background-image: url(../images/mi_bgreen.png);
}
#archive #scn_mimg::after {
background-image: url(../images/archive/main.png);
}
#archive main{
background-color: #b6d6c1;
}
#archive #scn_mimg h2{
color: #127733;
}
#archive .subnav{
background-color: #127733;
}
#archive .subnav li a{
color: #fff;
}
#archive .subnav li a:hover,
#archive .subnav li.current a{
color: #127733;
}
#archive h3{
border-color: #127733;
}
#archive h3::before,
#archive h3::after{
background-color:#127733;
}
#archive .linkbtn{
border-color: #127733;
}
#archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_green.svg);
}
#archive .linkbtn:hover{
background-color: #b6d6c1;
}
#archive .larrow dt::before{
border-left: 8px solid #127733;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#archive.archive main {
background-color: #ededed;
}
#archive.archive .subnav {
background-color: #5f6666;
}
#archive.archive .subnav li a{
color: #fff;
}
#archive.archive .subnav li a:hover,
#archive.archive .subnav li.current a{
color: #5F6666;
}
#archive.archive h3{
border-color: #5F6666;
}
#archive.archive h3::before,
#archive.archive h3::after{
background-color:#5F6666;
}
#archive.archive .linkbtn{
border-color: #5F6666;
}
#archive.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#archive.archive .linkbtn:hover{
background-color: #ededed;
}
#archive.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}
/****************
news
****************/
#news #scn_mimg {
background-image: url(../images/mi_bgreen.png);
}
#news #scn_mimg::after {
background-image: url(../images/news/main.png);
}
#news main{
background-color: #b6d6c1;
}
#news #scn_mimg h2{
color: #127733;
}
#news .subnav{
background-color: #127733;
}
#news .subnav li a{
color: #fff;
}
#news .subnav li a:hover,
#news .subnav li.current a{
color: #127733;
}
#news h3{
border-color: #127733;
}
#news h3::before,
#news h3::after{
background-color:#127733;
}
#news .linkbtn{
border-color: #127733;
}
#news .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_green.svg);
}
#news .linkbtn:hover{
background-color: #b6d6c1;
}
#news .larrow dt::before{
border-left: 8px solid #127733;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#news.archive main {
background-color: #ededed;
}
#news.archive .subnav {
background-color: #5f6666;
}
#news.archive .subnav li a{
color: #fff;
}
#news.archive .subnav li a:hover,
#news.archive .subnav li.current a{
color: #5F6666;
}
#news.archive h3{
border-color: #5F6666;
}
#news.archive h3::before,
#news.archive h3::after{
background-color:#5F6666;
}
#news.archive .linkbtn{
border-color: #5F6666;
}
#news.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#news.archive .linkbtn:hover{
background-color: #ededed;
}
#news.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}
/****************
scienceinsociety
****************/
#scienceinsociety #scn_mimg {
background-image: url(../images/mi_byellow.png);
}
#scienceinsociety #scn_mimg::after {
background-image: url(../images/scienceinsociety/main.png);
}
#scienceinsociety main{
background-color: #ffefb3;
}
#scienceinsociety #scn_mimg h2{
color: #ffcc00;
}
#scienceinsociety .subnav{
background-color: #ffcc00;
}
#scienceinsociety .subnav li a{
color: #fff;
}
#scienceinsociety .subnav li a:hover,
#scienceinsociety .subnav li.current a{
color: #ffcc00;
}
#scienceinsociety h3{
border-color: #ffcc00;
}
#scienceinsociety h3::before,
#scienceinsociety h3::after{
background-color:#ffcc00;
}
#scienceinsociety .linkbtn{
border-color: #ffcc00;
}
#scienceinsociety .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_yellow.svg);
}
#scienceinsociety .linkbtn:hover{
background-color: #ffefb3;
}
#scienceinsociety .larrow dt::before{
border-left: 8px solid #ffcc00;
}
/*archive*/
/*アーカイブをチェックするとバックが灰色に*/
#scienceinsociety.archive main {
background-color: #ededed;
}
#scienceinsociety.archive .subnav {
background-color: #5f6666;
}
#scienceinsociety.archive .subnav li a{
color: #fff;
}
#scienceinsociety.archive .subnav li a:hover,
#scienceinsociety.archive .subnav li.current a{
color: #5F6666;
}
#scienceinsociety.archive h3{
border-color: #5F6666;
}
#scienceinsociety.archive h3::before,
#scienceinsociety.archive h3::after{
background-color:#5F6666;
}
#scienceinsociety.archive .linkbtn{
border-color: #5F6666;
}
#scienceinsociety.archive .linkbtn a::before {
background-image: url(../images/common/icons/ico_arw_black.svg);
}
#scienceinsociety.archive .linkbtn:hover{
background-color: #ededed;
}
#scienceinsociety.archive .larrow dt::before{
border-left: 8px solid #5F6666;
}


/*強制的に上書きの置き換えをする場合はここに*/
.ttl2::before, .ttl2::after {
		background-color: #5F6666!important;
}

/*co-creation/sdgs-award/index.html add@2020.01*/
.ttlFlex {
	-webkit-align-items: center;
	align-items: center;
}
.ttlFlex .ttl {
	width: 50%;
}
.ttlFlex .imgLogo {
	width: 25%;
}


.awardLink {
	margin: 1em 0;
}
.awardLink li {
	width: calc((100% - 48px) / 3);
}
.awardLink li a,
.awardLink li span {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding: 8px 24px;
	color: #000;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.3rem;
	border: 3px solid;
	border-radius: 4px;
	-webkit-transition: all .2s;
	transition: all .2s;
}
.awardLink li a:hover {
	opacity: 0.7;
}
.awardLink li:nth-child(1) a,
.awardLink li:nth-child(1) span {
	border-color: #3CBEF0;
	background: #E7FFFF;
}
.awardLink li:nth-child(2) a {
	border-color: #DAB150;
	background: #FFFFE5;
}
.awardLink li:nth-child(3) a {
	border-color: #9DC93B;
	background: #E1F1D6;
}
.awardLink img {
	margin-right: 2em;
}

/* add 20201207 start */
.awardLink2020 {
	margin: 1em 0;
}
.awardLink2020 li {
	width: 373px;
}
.awardLink2020 li a,
.awardLink2020 li span {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-align-items: center;
	align-items: center;
	padding: 8px 24px;
	color: #000;
	text-decoration: none;
	font-weight: bold;
	font-size: 1.3rem;
	border: 3px solid;
	border-radius: 4px;
	-webkit-transition: all .2s;
	transition: all .2s;
}
.awardLink2020 li a:hover {
	opacity: 0.7;
}
.awardLink2020 li:nth-child(1) a,
.awardLink2020 li:nth-child(1) span {
	border-color: #3CBEF0;
	background: #E7FFFF;
}
.awardLink2020 li:nth-child(2) a {
	border-color: #DAB150;
	background: #FFFFE5;
}
.awardLink2020 li:nth-child(3) a {
	border-color: #9DC93B;
	background: #E1F1D6;
}
.awardLink2020 img {
	margin-right: 2em;
}
/* add 20201207 end */

/*タブ切り替え全体のスタイル*/
.tabs {
	width: 100%;
}

.tab_item a {
	color:#565656;
	text-decoration:none;
}

/*タブのスタイル*/

.tabs > ul {
	box-sizing: border-box;
display: -webkit-flex;
display: -ms-flex;
display: flex;
}

.tabs > ul > li {
	width: calc((100% - 11px) / 2.8);
	min-height: 82px;
	margin-right: 4px;
	background-color: #d9d9d9;
	font-size: 1.1rem;
display: flex;
}

.tabs > ul > li > a {
	display:block;
	color:#565656;
	text-decoration:none;
	padding: 10px;
	font-weight: bold;
	transition: all 0.2s ease;
	text-align:center;
	width:100%;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}

.tabs > ul > li:last-child {
	margin-right: 0;
}
.tabs > ul > li > a:hover {
	opacity: 0.75;
}
/*ラジオボタンを全て消す*/
input[name="tab_item"] {
	display: none;
}

/*タブ切り替えの中身のスタイル*/
.tab_content {
	/*display: none;*/
	padding: 40px;
	clear: both;
	overflow: hidden;
}
#daijin_content {
	border: 3px solid #ED7D31;
}
#riji_content {
	border: 3px solid #4472C4;
}
#yusyu_content {
	padding: 0;
	border: 3px solid #7030A0;
}
#jisedai_content {
	border: 3px solid #70AD47;
}
/*選択されているタブのコンテンツのみを表示
#daijin:checked ~ #daijin_content,
#riji:checked ~ #riji_content,
#yusyu:checked ~ #yusyu_content,
#jisedai:checked ~ #jisedai_content {
	display: block;
}*/
/*選択されているタブのスタイルを変える*/

.tabs > ul > li#daijin {
	background-color: #ED7D31;
	color: #fff;
}
.tabs > ul > li#daijin > a,
.tabs > ul > li#riji > a,
.tabs > ul > li#yusyu > a,
.tabs > ul > li#jisedai > a {
	color: #fff;
}
.tabs > ul > li#riji {
	background-color: #4472C4;
}

.tabs > ul > li#yusyu {
	background-color: #7030A0;
}
.tabs > ul > li#jisedai {
	background-color: #70AD47;
}
.tab_content h4 {
	margin-bottom: 24px;
	font-size: 1.4rem;
	color: #2F5496;
	border-bottom: solid 1px #2F5496;
	line-height: 1.5;
}
.tab_content h4 span {
	display: inline-block;
	margin-left: 1em;
	font-size: 1rem;
	font-weight: bold;
	color: #333;
}
.sdgsList li {
	margin-left: 10px;
	margin-bottom: 10px;
	padding: 0;
}
.sdgsList li:first-child {
	margin-left: 0;
}
.sdgsList img {
	width: 100%;
	max-width: 100px;
	height: auto;
}
.awardlogo img {
	width: 100%;
	max-width: 90px;
	height: auto;
}
.awardlogo {
	margin-right: 24px;
}
.resultImgList {
	margin-bottom: 24px;
}
.resultImgList_sgl {
	text-align: center;
}
.resultImgList li {
	width: calc((100% - 40px) / 2);
	margin: 0 10px;
	text-align: center;
}
.resultImgList_sgl li {
	margin-bottom: 24px;
}
.resultImgList img,
.resultImgList_sgl img {
	/*border: 1px solid #CCC;*/
}

.border {
	border: 1px solid #CCC;
	/*padding:10px;*/
}

.resultImgList figcaption,
.resultImgList_sgl figcaption,
.youtube_caption {
	margin: 5px auto 0;
	font-size: 0.85rem;
	text-align: left;
	line-height: 1.3;
}
.resultImgList figcaption {
	max-width: 400px;
}
.resultImgList_sgl figcaption {
	/*max-width: 700px;*/
	text-align: left;
}
.youtube_caption {
	margin-top: 0;
}
.tab-group {
	display: flex;
	justify-content: center;
}
.tab {
	display: -webkit-flex;
	display: -ms-flex;
	display: flex;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	flex-grow: 1;
	padding: 16px 10px;
	text-align:center;
	border-bottom: 1px solid #7030A0;
	border-right: 1px solid #7030A0;
	background: #d9d9d9;
	transition: all 0.2s ease;
	color: #565656;
	font-weight: bold;
}

.tab span {
	font-weight: bold;
}

.tab:last-child {
	border-right: none;
}
.tab:hover {
	opacity: 0.7;
}

.tab a {
	text-decoration:none;
	color:#565656;
	height:100%;
display: flex;
-webkit-justify-content: center;
justify-content: center;
-webkit-align-items: center;
align-items: center;
}

.panel-group {
	padding: 40px;
	border-top: none;
}
.tab.is-active {
	background: #7030A0;
	color: #FFF;
	transition: all 0.2s ease-out;
}
.tab.is-active a {
	color:white;
	text-decoration:none;
	font-weight:bold;
}
.panel.is-show{
	display:block;
}
.linkbtn.w170,
.linkbtn_nolink.w170 {
	width: 170px;
	min-width:170px;
	max-width:170px;
}
.linkbtn_nolink {
	position: relative;
	display: inline-block;
	min-width: 305px;
	border: solid 3px #5F6666;
	border-radius: 40px;
	box-sizing: border-box;
	font-weight: bold;
	text-align: left;
	background-color: #cecece;
}
.linkbtn_nolink span {
	display:block;
	padding: 5px 40px 5px 12px;
	vertical-align: middle;
	padding-bottom: 5px;
	color: #000000;
	font-weight: bold;
}
.linkbtn_nolink span::before {
	position: absolute;
	right: 10px;
	top: calc(50% - 13px);
	content: "";
	display: inline-block;
	width: 26px;
	height: 24px;
	background-image: url(../images/common/icons/ico_arw_black.svg);
	background-repeat: no-repeat;
	background-size: 100%;
}
.awardList_img img {
	width: 100%;
	margin-top: 24px;
}