@charset "utf-8";

/*
Theme Name: 北研
Theme URI: https://www.hokken.co.jp
Description: オリジナルテーマ
Author: (株)エイト
Author URI: 
Version: 1.0
*/

/* 使用フォント */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;600;700&family=Zen+Kaku+Gothic+Antique:wght@300;400;500;700;900&family=Zen+Kaku+Gothic+New:wght@400;700&display=swap');


/* サイト内共通 */

body {
	font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 500;
    font-style: normal;
	color: #333;
}

p {
	line-height: 1.8em;
	margin-bottom: 1.2em;
	font-size:100%;
}

a {
	color:#4f9c7f;
	text-decoration:underline;
	transition:0.2s ease-in-out;
}

img {
    /*width: 100%;*/
    max-width: 100%;
    height: auto;
}

a:hover {
	color:#64a3e2;
	text-decoration:underline;
}

a:visited {
	color:#416282;
}

.container {
    position: relative;
    margin: 0 auto;
}

.table {
	border-collapse: collapse;
}

.table th,
.table td {
	border:1px solid #b3b3b3;
}

.item_photo {
	text-align: center;
	line-height: 1.4em;
	font-size: 90%;
}

.link_btn01 {
    text-align: center;
	margin:0 auto;
}

.link_btn01 a {
	display: inline-block;
    position: relative;
    width:320px;
    font-size: 1rem;
    line-height: 1.2;
	background-color: #1695d4;
    border:2px solid #1695d4;
	color:#fff;
	padding:15px 45px 15px 25px;
	text-align: left;
	text-decoration: none;
	border-radius: 25px;
}

.link_btn02 {
	width:80%;
	height:auto;
}

.link_btn02 a {
	display: block;
    position: relative;
	width:240px;
	background-color: #1695d4;
    border:2px solid #1695d4;
	color:#fff;
	padding:15px 30px;
	text-align: left;
	text-decoration: none;
	border-radius: 25px;
}

.link_btn01 a ,.link_btn02 a {
    background-image: url("../img/btn_arrow01.svg");
    background-repeat: no-repeat;
    background-position: center right 15px;
    background-size: 20px;
}

.link_btn01 a:hover ,.link_btn02 a:hover {
    background-color: #FFF;
    color: #1695d4;
    background-image: url("../img/btn_arrow02.svg");
}

.link_btn03 a {
    display: inline-block;
    position: relative;
    font-size: 0.9rem;
    padding-left: 15px;
}

.link_btn03 a:before {
    content:"";
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    left:0;
    width:10px;
    height: 10px;
    background-color: #3e3d3f;
    clip-path: polygon(0 0,100% 50%, 0 100%);
}

.link_btn_w {
    text-align: center;
	margin:0 auto;
}

.link_btn_w a {
	display: inline-block;
    position: relative;
    width:300px;
    font-size: 1rem;
    line-height: 1.2;
	background-color: #FFF;
    border:2px solid #1695d4;
	color:#1695d4;
	padding:15px 45px 15px 25px;
	text-align: left;
	text-decoration: none;
	border-radius: 25px;
    background-image: url("../img/btn_arrow02.svg");
    background-repeat: no-repeat;
    background-position: center right 15px;
    background-size: 20px;
}

.link_btn_w a:hover {
	background-color: #1695d4;
    color: #FFF;
    background-image: url("../img/btn_arrow01.svg");
}

.link_btn_ex {
    text-align: center;
	margin:0 auto;
}

.link_btn_ex a {
	display: inline-block;
    position: relative;
    width:300px;
    font-size: 1rem;
    line-height: 1.2;
	background-color: #FFF;
    border:1px solid #333;
	color:#333;
	padding:10px 45px 10px 25px;
	text-align: center;
	text-decoration: none;
	border-radius: 25px;
}

.link_btn_ex a:hover {
	background-color: #eee;
    color: #333;
}

.narrow {
    width: 768px;
    margin: 0 auto;
}

img.img-radius {
    border-radius: 20px;
}

/* リンクアイコン */
a[href$=".pdf"]:before {
    content: "";
    background-image: url("../img/ic_pdf.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 20px auto;
    padding-left: 30px;
}

a[href$=".doc"]:before,
a[href$=".docx"]:before {
    content: "";
    background-image: url("../img/ic_doc.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 50px auto;
    padding-left: 45px;
}

a[href$=".xls"]:before,
a[href$=".xlsx"]:before {
    content: "";
    background-image: url("../img/ic_xls.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 50px auto;
    padding-left: 45px;
}

a[href$=".ppt"]:before,
a[href$=".pptx"]:before {
    content: "";
    background-image: url("../img/ic_ppt.svg");
    background-repeat: no-repeat;
    background-position: left center;
    background-size: 50px auto;
    padding-left: 45px;
}

.link_btn01 a[href$=".pdf"]:before {
    background: none;
    padding-left: 0;
}

/* サイト共通共通 */

section {
	padding:80px 0;
}

#main {
	margin-bottom: 80px;
}

.h_sub {
    display: inline-block;
    font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 1rem;
    padding:0 0 3px;
    margin-bottom: 10px;
    color: #1695d4;
    border-bottom:1px solid #1695d4;
}

.h_type01 {
    display: block;
    font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 700;
    font-style: normal;
	font-size:2rem;
    letter-spacing: 3px;
	line-height:1.2;
    padding-bottom:0;
	margin:0;
}

.h_type02 {
    display: block;
    position: relative;
	font-size:1.5rem;
    text-align: left;
	line-height:1.4;
	margin:0 auto 30px;
}

.h_type03 {
    display: block;
    position: relative;
	font-size:1.2rem;
    text-align: left;
	line-height:1.4;
}

.h_type04 {
    display: block;
    position: relative;
	font-size:1.2rem;
    text-align: center;
	line-height:1.4;
    border-bottom:1px solid #ccc;
    margin-bottom: 10px;
    padding-bottom: 10px;
}

.h_type05 {
    display: block;
    position: relative;
	font-size:1.8rem;
    font-weight: bold;
    letter-spacing: 2px;
    color: #826e50;
    text-align: center;
	line-height:1.4;
}

.h_type05_s {
    display: block;
    position: relative;
	font-size:1.6rem !important;
    font-weight: bold;
    letter-spacing: 2px;
    color: #826e50 !important;
    text-align: center;
	line-height:1.4;
}

.h_type06 {
    display: block;
	font-size:1.2rem;
    font-weight: bold;
    letter-spacing: 1px;
    color: #FFF;
    text-align: center;
	line-height:1.4;
}

.h_type07 {
    display: inline-block;
    font-size: 1.3rem !important;
    font-weight: bold;
    letter-spacing: 1px;
    color: #966e3c !important;
    line-height: 1.5;
    padding-bottom: 10px;
    border-bottom: 2px dotted #CCC;
}

.copy01 {
    font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 900;
    font-style: normal;
    font-size: 1.6rem;
    line-height: 1.7;
    letter-spacing: 2px;
}

.copy02 {
    font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 900;
    font-style: normal;
    font-size: 1.4rem;
    line-height: 1.7;
    letter-spacing: 2px;
}

.fig_title01 {
    text-align: center;
}

.fig_title01 span {
    display: inline-block;
    color: #FFF;
    font-size: 1.2rem;
    line-height: 1.2;
    background-color: #826e50;
    padding: 10px 20px;
    border-radius: 25px;
}

/* 固定ページ・投稿共通 */

main {
    padding: 80px 0 0;
}

/* パンくず */

#bc_nav {
	font-size:0.9rem;
	margin: 15px 0 30px;
    line-height: 1.6;
}

/* */

p + h2,
ul + h2,
ol + h2,
table + h2 {
	margin-top: 40px;
}

p + h3,
ul + h3,
ol + h3,
table + h3 {
	margin-top: 20px;
}

.row {
    justify-content: space-between;
}

.col_img img {
    /*width: 100%;*/
    max-width: 100% !important;
    height:auto;
}

.list_nostyle {
    list-style: none;
    margin-left: 0;
}

.list_nostyle li {
    margin-bottom: 1em;
}

/* 固定ページ共通 */

#page #cHead {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}


#page h1 {
    font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #009fe8;
    font-size: 2.6rem;
    line-height: 1.5;
    margin-bottom: 1.5em;
    letter-spacing: 2px;
}

#page h2 {
    font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #009fe8;
    line-height: 1.5;
    font-size: 1.9rem;
}

.cat_title {
     font-family: "Zen Kaku Gothic Antique", sans-serif;
    font-weight: 700;
    font-style: normal;
    color: #009fe8;
    font-size: 1rem;
}

.cat_nav {
    display: flex;
    justify-content: space-between;
    list-style: none;
    flex-wrap: wrap;
    margin: 0;
}

.cat_nav li {
    display: block;
    position: relative;
    overflow: hidden;   
    margin-bottom: 20px;
    text-align: center;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 14px;
}

.cat_nav li a {
    position: relative;
    z-index: 1;
    display: block;
    height: 100%;
    padding: 50px 20px;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.4);
}

.cat_nav li::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
  transition: opacity .3s ease;
  z-index: 0;
  pointer-events: none;
}

.cat_nav li:hover::after,
.cat_nav li:focus-within::after {
    opacity: 0;
}

.cat_nav li a:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(255,255,255,.8), 0 0 0 6px rgba(0,120,255,.7);
    border-radius: 14px;
}

/*
/* コンテンツ別 */
/*

/* 北研について */

main.corporate {
    background-image: url("../img/cbg_corporate.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

.cp_greeting {
    background-image: url("../corporate/img/president.png");
    background-repeat: no-repeat;
    background-position: bottom right;
    background-size: 50% auto;
}

.cp_greeting .col-txt {
    padding-bottom: 50px;
}

.ov_img_row {
    position: absolute;
    top:80px;
    left:0;
    width:20%;
    height: auto;
}

.ov_img {
    font-size: 0.9rem;
    margin-bottom: 60px;
}

.ov_img img {
    display: block;
    margin-bottom: 5px;
    border-radius: 6px;
}

.aw_year {
    font-family: "Barlow", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 3rem;
    color:#c8c8b4;
    margin-bottom: 20px;
}

.row_awards h3 {
    font-size: 1.4rem;
    line-height: 1.4;
    margin-bottom: 15px;
}

/* 研究開発 */

main.lab {
    background-image: url("../img/cbg_lab.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

.h_labbox01 {
    position: relative;
    display: inline-block;
    background-color: #4d73ab;
    color: #FFF;
    font-size: 1.2rem;
    padding: 10px 20px;
    border-radius: 8px 8px 0 0;
}

.h_labbox01:after {
    content: "";
    display: block;
    position: absolute;
    top:0;
    right:-25px;
    width:30px;
    height:100%;
    background-color: #4d73ab;
    clip-path: polygon(0 0, 0 100%, 100% 100%);
}

.labbox01 {
    background-color: #a6b9d5;
    padding: 20px;
    border-radius: 0 8px 8px;
}

.flow01 {
    display: block;
    list-style: none;
    margin: 0;
}

.flow01 li {
    display: block;
    position: relative;
    background-color: #FFF;
    text-align: center;
    padding: 8px 10px;
    border-radius: 6px;
}

.flow01 li.with-arrow {
    margin-bottom: 40px;
}

.flow01 li.with-arrow:after {
    content: "";
    position: absolute;
    bottom:-25px;
    left:50%;
    transform: translateX(-50%);
    width:30px;
    height: 15px;
    background-color: #4d73ab;
    clip-path: polygon(0 0,100% 0, 50% 100%);
}

.cat_nav_lab li {
    flex-basis: 48%;
}

.btn_technology { background-image: url("../laboratory/img/lab_n01.jpg"); }
.btn_result     { background-image: url("../laboratory/img/lab_n02.jpg"); }
.btn_future     { background-image: url("../laboratory/img/lab_n03.jpg"); }
.btn_laboratory { background-image: url("../laboratory/img/lab_n04.jpg"); }

.tecbox {
    position: relative;
    padding:40px 100px;
    border:2px solid #826e50;
    border-radius: 20px;
}

.tecbox_title01 {
    display: flex;
    justify-content: center;
    background-color: #FFF;
    width:340px;
    margin: -70px auto 50px;
    padding: 0 20px;
}

.tecbox_title_num {
    background-color: #826e50;
    color: #FFF;
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    border-radius: 50%;
    width:60px;
    height:60px;
    padding: 12px 0 0;
    margin-right: 20px;
    line-height: 0.9;
}

.tecbox_title_num span {
    display: block;
    font-size: 0.8rem;
    font-weight: normal;
}

.tecbox_title01 h4 {
    display: block;
    color: #826e50;
    font-size: 1.6rem;
    padding: 15px 0 0;
}

.tecbox h5 {
    text-align: center;
}

.tecbox h5 span {
    display: inline-block;
    color: #826e50;
    font-size: 1.3rem;
    padding:10px 0;
    border-top:1px solid #826e50;
    border-bottom:1px solid #826e50;
}

.dl_laboratory dt {
    flex-basis:20%;
}

.dl_laboratory dd {
    flex-basis:80%;
}

/* 種菌製造 */

main.products {
    background-image: url("../img/cbg_products.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

.h_prdbox01 {
    position: relative;
    display: inline-block;
    background-color: #4399d0;
    color: #FFF;
    font-size: 1.2rem;
    padding: 10px 20px;
    border-radius: 8px 8px 0 0;
}

.h_prdbox01:after {
    content: "";
    display: block;
    position: absolute;
    top:0;
    right:-25px;
    width:30px;
    height:100%;
    background-color: #4399d0;
    clip-path: polygon(0 0, 0 100%, 100% 100%);
}

.prdbox01 {
    background-color: #b4d6ec;
    padding: 20px;
    border-radius: 0 8px 8px;
}

.flow02 {
    display: block;
    list-style: none;
    margin: 0;
}

.flow02 li {
    display: block;
    position: relative;
    background-color: #FFF;
    text-align: center;
    padding: 8px 10px;
    border-radius: 6px;
}

.flow02 li.with-arrow01 {
    margin-bottom: 40px;
}

.flow02 li.with-arrow01:after {
    content: "";
    position: absolute;
    right:-25px;
    bottom:6px;
    width:15px;
    height: 25px;
    background-color: #4d73ab;
    clip-path: polygon(0 0,100% 50%, 0 100%);
}

/* 支援プログラム */

main.support {
    background-image: url("../img/cbg_support.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

.h_supbox01 {
    position: relative;
    display: inline-block;
    background-color: #1da8a3;
    color: #FFF;
    font-size: 1.2rem;
    padding: 10px 20px;
    border-radius: 8px 8px 0 0;
}

.h_supbox01:after {
    content: "";
    display: block;
    position: absolute;
    top:0;
    right:-27px;
    width:30px;
    height:100%;
    background-color: #1da8a3;
    clip-path: polygon(0 0, 0 100%, 100% 100%);
}

.supbox01 {
    background-color: #a5dcda;
    padding: 20px;
    border-radius: 0 8px 8px;
}

.flow03s {
    display: block;
    list-style: none;
    margin: 0;
}

.flow03s li {
    display: block;
    position: relative;
    background-color: #FFF;
    text-align: center;
    padding: 8px 10px;
    border-radius: 6px;
}

.flow03s li.with-arrow {
    margin-bottom: 40px;
}

.flow03s li.with-arrow:after {
    content: "";
    position: absolute;
    bottom:-25px;
    left:50%;
    transform: translateX(-50%);
    width:30px;
    height: 15px;
    background-color: #1da8a3;
    clip-path: polygon(0 0,100% 0, 50% 100%);
}

/** 生産者支援 **/

.cat_nav_farmers li {
    flex-basis: 31%;
}

.btn_guide { background-image: url("../support/farmers/img/farmers_n01.jpg"); }
.btn_support { background-image: url("../support/farmers/img/farmers_n02.jpg"); }
.btn_sunmush { background-image: url("../support/farmers/img/farmers_n03.jpg"); }

.btn_products { background-image: url("../support/farmers/guide/img/guide_n01.jpg"); }
.btn_material { background-image: url("../support/farmers/guide/img/guide_n02.jpg"); }
.btn_process { background-image: url("../support/farmers/guide/img/guide_n03.jpg"); }

.dl_list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
}

.dl_list li {
    display: block;
    flex-basis: 48%;
    margin-bottom: 20px;
}

.dl_list li a {
    display: block;
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #333;
    border-radius: 20px;
}

.dl_list li a:hover {
    background-color: #333;
    color: #FFF;
}

.products_item01 {
    margin-bottom: 40px;
}

.products_item01 h4 {
    font-size: 1rem;
    line-height: 1.4;
}

.products_item01 p {
    margin-bottom: 10px;
}

.prd_tag01,.prd_tag02,.prd_tag03 {
    display: inline-block;
    padding: 3px 5px;
    font-size: 0.8rem;
    color: #FFF;
}

.prd_tag01 { background-color: #4e94c8; }
.prd_tag02 { background-color: #d77855; }
.prd_tag03 { background-color: #64a06e; }

a.m_bnr {
    display: block;
    width: 100%;
    height: 100%;
    color: #333;
    text-decoration: none;
    line-height: 1.6;
    background-color: #a5dcda;
    padding:15px 15px 30px;
    background-image: url("../img/ic_exlink.svg");
    background-repeat: no-repeat;
    background-position: bottom 10px right 10px;
    background-size: 15px auto;
    border-radius: 6px;
}

a.m_bnr:hover {
    background-color: #ceefec;
}

a.m_bnr .mbnr_name {
    font-size: 0.9rem;
}

a.m_bnr .mbnr_prd {
    display: block;
    font-weight: bold;
}

/** 生産者支援プログラム **/

.prg_item01 {
    background-color: #d0eaf6;
}

.prg_item01 .col-txt {
    padding: 10px 20px 20px;
    background-image: url("../img/btn_arrow01.svg");
    background-repeat: no-repeat;
    background-position: top 15px right 15px;
    background-size: 20px;
}

.prg_item02 {
    color: #FFF;
    background-color: #1da8a3;
    background-repeat: no-repeat;
}

.prg_item03 {
    align-items: flex-start;
    padding:20px;
    border:1px solid #ccc;
    background-image: url("../img/btn_arrow04.svg");
    background-repeat: no-repeat;
    background-position: bottom 15px right 15px;
    background-size: 20px;
}

.prg_item03 .col-txt {
    padding: 15px 0 0;
}

.prg_item03 .col-img,
.prg_item03 .col-txt {
    align-self: flex-start;
}

@media screen and (min-width: 1025px) {
.prg_item02 {
    aspect-ratio: 1 / 1 ;
    background-position: top 40px center;
    background-size: auto 50px;
    padding: 110px 40px 10px 40px;
    border-radius: 50%;
}
}

@media all and (min-width: 768px) and (max-width: 1024px) {
.prg_item02 {
    background-position: top 30px center;
    background-size: auto 50px;
    padding: 100px 20px 10px 20px;
    border-radius: 25px;
}
}

@media screen and (max-width: 767px) {
.prg_item02 {
    background-position: center left 30px;
    background-size: auto 50px;
    padding: 20px 20px 20px 100px;
    border-radius: 25px;
    margin-bottom: 20px;
}

.prg_item02 h3,.prg_item02 p {
    text-align: left !important;
}

.prg_item03 .col-txt {
    padding: 0;
}

}

.prg_item02_01 {background-image: url("../img/ic_company.svg");}
.prg_item02_02 {background-image: url("../img/ic_organizetion.svg");}
.prg_item02_03 {background-image: url("../img/ic_owner.svg");}

.prg_item02 p {
    padding: 0 0 30px;
    background-image: url("../img/btn_arrow03.svg");
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 20px;
}

@media screen and (max-width: 767px) {
.prg_item02 p {
    padding: 0 0 25px;
    background-image: url("../img/btn_arrow03.svg");
    background-repeat: no-repeat;
    background-position: bottom right 15px;
    background-size: 20px;
}
}

.cat_nav_program li {
    flex-basis: 100%;
}

.btn_prg_material { background-image: url("../support/farmers/program/img/program_n01.jpg"); }

/** 法人・個人の皆さま **/

.lp_mimg {
    background-color: #966e3c;
    background-repeat: no-repeat;
    background-position: center right;
    background-size: auto 100%;
    padding: 50px 0;
}

.lp_company {
    background-image: url("../support/farmers/program/img/company_mimg.png");
}

.lp_owner {
    background-image: url("../support/farmers/program/img/owner_mimg.png");
}

.t_copy {
    width: 50%;
    -webkit-filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.8));
    filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.5)); 
}

.h_lpfig02 {
    background-image: url("../support/farmers/program/img/lp_p01.png");
    background-repeat: no-repeat;
    background-size: 420px auto;
    background-position: center right;
    padding: 30px 0;
}

.col-lpfig02 {
    position: relative;
    text-align: center;
    padding: 0 20px 20px;
    border-right:1px solid #ccc;
    border-bottom:1px solid #ccc;
    border-radius:0 0 25px 0;
}

.col-lpfig02:before {
    content: "";
    display: block;
    position: absolute;
    width:20px;
    height:20px;
    bottom:-16px;
    right:-16px;
    border: 1px solid #ccc;
    border-radius: 50%;
}

.col-lpfig02:after {
    content: "";
    display: block;
    position: absolute;
    width:10px;
    height:10px;
    bottom:-26px;
    right:-26px;
    border: 1px solid #ccc;
    border-radius: 50%;
}

.lpfig02_t {
    display: inline-block;
    position: relative;
    font-size: 1.3rem;
    padding: 0 0 0 40px;
}

.lpfig02_t span {
    display: block;
    position: absolute;
    width:30px;
    height:30px;
    top:0;
    left:0;
}

.lpfig02_t span img,.lpfig02_fig img {
    width: auto;
    height: 100%;
}

.lpfig02_fig {
    height:100px;
}

.lpfig03_t {
    position: relative;
}

.lpfig03_t:after {
    content: "";
    display: block;
    position: absolute;
    width:2px;
    height:50px;
    top:5px;
    right:0;
    background-color: #ccc;
    transform: rotate(20deg);
}

.lpfig03_t h4 {
    display: inline-block;
    font-size: 1.5rem;
    padding: 13px 0 0 40px;
}

.lpfig03_t h4 span {
    display: block;
    text-align: center;
    position: absolute;
    width:30px;
    height:30px;
    top:15px;
    left:0;
}

.lpfig03_t h4 span img {
    width: auto;
    height: 100%;
}

.lpfig04_t {
    position: relative;
    display: inline-block;
    font-size: 1.4rem;
    padding: 13px 0 0 70px;
}

.lpfig04_t span {
    display: block;
    text-align: center;
    position: absolute;
    width:60px;
    height:60px;
    top:0;
    left:0;
}

.lpfig04_t h4 span img {
    width: auto;
    height: 100%;
}

.col_voice_r {
    position: relative;
    padding:4% 33% 0 6%;
    border-left:1px solid #333;
}

.col_voice_r:before {
    content:"";
    position: absolute;
    width:3px;
    height:20px;
    top:50%;
    transform: translateY(-50%);
    left:-2px;
    background-color: #f5ede6;
}

.col_voice_r:after {
    content:"";
    position: absolute;
    width:2px;
    height:24px;
    top:50%;
    transform: translateY(-50%) rotate(-40deg);
    left:-9px;
    border-left:1px solid #333;
}

.col_voice_l {
    position: relative;
    padding:4% 6% 0 33%;
    border-right:1px solid #333;
}

.col_voice_l:before {
    content:"";
    position: absolute;
    width:3px;
    height:20px;
    top:50%;
    transform: translateY(-50%);
    right:-2px;
    background-color: #f5ede6;
}

.col_voice_l:after {
    content:"";
    position: absolute;
    width:2px;
    height:24px;
    top:50%;
    transform: translateY(-50%) rotate(40deg);
    right:-9px;
    border-right:1px solid #333;
}

.h_supbox01 {
    position: relative;
    display: inline-block;
    background-color: #1da8a3;
    color: #FFF;
    font-size: 1.2rem;
    padding: 10px 20px;
    border-radius: 8px 8px 0 0;
}

.h_supbox01:after {
    content: "";
    display: block;
    position: absolute;
    top:0;
    right:-26px;
    width:30px;
    height:100%;
    background-color: #1da8a3;
    clip-path: polygon(0 0, 0 100%, 100% 100%);
}

.supbox01 {
    background-color: #a5dcda;
    padding: 20px;
    border-radius: 0 8px 8px;
}

.flow03 {
    background-color: #FFF;
    text-align: center;
    padding: 20px 10px 0 10px;
    border-radius: 6px;
}

.flow03 span {
    display: block;
    position: absolute;
    top:50%;
    transform: translate(-50%,-50%);
    left:50%;
    width: 100%;
}

.with-arrow03 {
    position: relative;
    margin-bottom: 40px;
}

.with-arrow03:after {
    content: "";
    position: absolute;
    left:100px;
    bottom:-25px;
    width:25px;
    height: 15px;
    background-color: #1da8a3;
    clip-path: polygon(0 0,100% 0, 50% 100%);
}

.innav {
    display: flex;
    justify-content: space-between;
    width: 100%;
    margin: 0;
    list-style: none;
    border:1px solid #ccc;
}

.innav li {
    display: block;
    flex-basis: 50%;
    text-align: center;
    margin: 0;
}

.innav li a {
    display: block;
    padding: 20px;
    color: #333;
}

.innav li a:hover {
    background-color: #dceff9;
}

.innav li a span {
    display: inline-block;
    position: relative;
    padding: 0 0 0 20px;
}

.innav li a span:before {
    content: "";
    position: absolute;
    width:12px;
    height:8px;
    top:7px;
    left:0;
    background-color: #1da8a3;
    clip-path: polygon(0 0,100% 0, 50% 100%);
}

.rline {
    position: relative;
}

.rline:after {
    content: "";
    position: absolute;
    width: 2px;
    height:30px;
    top:50%;
    transform: translateY(-50%);
    right:-1px;
    background-color: #1695d4;
}

.flow04 {
    position: relative;
    background-color: #FFF;
    text-align: center;
    padding: 30px 10px 30px 10px;
    border-radius: 6px;
}

.flow04s {
    position: relative;
    background-color: #ffffd8;
    text-align: center;
    padding: 10px 10px;
    border-radius: 6px;
}

.flow04 .flow04_inner {
    display: block;
    position: absolute;
    top:50%;
    transform: translate(-50%,-50%);
    left:50%;
    width: 100%;
}

.arw_1,.arw_2,.arw_3 {
    position: relative;
    margin-bottom: 40px;
}

.sunmush_nav {
    display: flex;
    justify-content: space-around;
    margin: 0;
    list-style: none;
}

.sunmush_nav li {
    display: block;
    position: relative;
    flex-basis: 30%;
    text-align: center;
    background-color: #1695d4;
    border-radius: 6px;
}

.sunmush_nav li a {
    display: block;
    padding: 20px;
    color: #fff;
    text-decoration: none;
}

.sunmush_nav li a span {
    display: inline-block;
    position: absolute;
    top:50%;
    left:50%;
    transform: translate(-50%,-50%);
    width:100%;
    height:auto;
}

/* 生産者 */

main.farmers {
    background-image: url("../img/cbg_farmers.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

/* 流通・販売 */

main.distribution {
    background-image: url("../img/cbg_distribution.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

/* お知らせ・お問い合わせ*/
main.inquiry,
main.news  {
    background-image: url("../img/cbg_news.svg");
    background-repeat: no-repeat;
    background-position: top right -100px;
    background-size: 50% auto;
}

.row_ds {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

/* お知らせ */

/* お知らせ一覧 */

.news_list {
	display: flex;
    justify-content: space-between;
    margin-bottom: 40px;
}

.news_item {
    flex-basis: 24%;
    background-color: #dceff9;
    overflow: hidden;
}

.news_item .news_thumb {
    width: 100%;
    aspect-ratio: 3 / 2 ;
}

.news_item .news_thumb img {
    width: 100%;
    height:auto;
    object-fit: cover;
    transition:0.2s;
}

.news_item:hover img {
	transform:scale(1.1);
}

.news_item .news_txt {
    padding:15px;
}

.news_date {
    color: #1695d4;
    font-size: 0.9rem;
    margin-bottom: 15px;
}

.news_item h3 {
    font-size: 1.1rem;
    line-height: 1.4;
    margin-bottom: 15px;
}

.news_tag {
    display: block;
    list-style: none;
    margin: 0;
}

.news_tag li {
    display: inline-block;
    font-size: 0.8rem;
    padding: 4px 6px 6px;
    background-color: #FFF;
    margin:0 5px 5px 0;
    line-height: 1;
}

.news_tag li:last-child {
    margin:0 0 5px 0;
}


/* サイト内共通パーツ*/

.table th,
.table td {
	padding:10px;
}
	
a.anchor {
    display: block;
    padding-top: 120px;
    margin-top: -120px;
}

.table00 {}

.table00 th,
.table00 td {
    padding:10px;
    line-height: 1.4;
}

.table00 th {
    text-align: left;
}

.table01 {
    width: 100%;
    border-collapse: collapse;
}

.table01 th,
.table01 td {
    padding: 20px 0;
    line-height: 1.4;
    text-align: left;
    border-bottom: 1px solid #ccc;
    vertical-align: top;
}

.table01 th {
    color: #009fe8;
    font-weight: bold;
    padding-right: 20px;
}

.table01 td span {
    font-size: 0.9rem;
}

.table02 {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0px 20px;
}

.table02 th,
.table02 td {
    padding: 5px 10px ;
    line-height: 1.4;
    text-align: left;
    vertical-align: top;
}

.table02 th {
    color: #009fe8;
    font-weight: bold;
    padding-right: 20px;
    border-right: 1px solid #ccc;
}

.table03 {
    width: 100%;
    border-collapse: collapse;
}

.table03 th,
.table03 td {
    padding: 15px;
    line-height: 1.4;
    text-align: left;
    border: 1px solid #ccc;
    vertical-align: top;
}

.table03 th {
    background-color: #8acae9;
    font-weight: bold;
}

.table04 {
    width: 100%;
    border-collapse: collapse;
}

.table04 th,
.table04 td {
    padding: 15px;
    line-height: 1.4;
    text-align: center;
    border: 1px solid #ccc;
    vertical-align: middle;
}

.table04 th {
    background-color: #8acae9;
    font-weight: bold;
}

.table_scroll {
    overflow-x: scroll;
}

.v-middle th,.v-middle td {
    vertical-align: middle ;
}

.dl-table {
    display: flex;
    flex-wrap: wrap;
}

.dl-table dt,.dl-table dd {
    padding:15px 0;
    line-height: 1.4;
    border-bottom:1px solid #ddd;
}

.gmap,.youtube {
    position: relative;
    width: 100%;
    padding-top: 56.25%;
    height: 0;
}

.gmap iframe,.youtube iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.row-type01 {
    display: flex;
    justify-content: flex-start;
}

.row-rev {
    flex-direction: row-reverse;
}

.row-around {
    justify-content: space-around;
}

.row-3r:after{
    content:"";
    display: block;
    width:30%;
}

.row-itemlist .col-img {
    margin-bottom: 20px;
}

.col-img {
    text-align: center;
    font-size: 0.9rem;
    line-height: 1.4;
}

.col-img img {
    margin-bottom: 5px;
}

.img-border {
    border:1px solid #ddd;
}

.txt-s {
    font-size: 0.9rem;
}

.txt-center {
    text-align: center !important;
}

.txt-left {
    text-align: left !important;
}

.s-narrow {
    width: 640px;
    margin: 0 auto;
}

.box01 {
    display: inline-block;
    padding:30px;
    border:1px solid #333;
}

.box02 {
    display: block;
    padding:15px 15px 35px;
    border:1px solid #ccc;
}

.box03 {
    padding:30px;
    background-color: #dbe3ee;
    border-radius: 25px;
}

.box03s {
    padding:20px;
    background-color: #dbe3ee;
    border-radius: 4px;
}

.box04 {
    padding:40px;
    background-color: #fff;
    border-radius: 25px;
}

.box05 {
    padding:40px;
    background-color: #f2e3bc;
    border-radius: 25px;
}

.box06 {
    padding:40px 120px;
    background-color: #d0eaf6;
    border-radius: 5px;
}

.bg_gray {
    background-color: #edf0eb;
}

.bg_orange {
    background-color: #fad9c7;
}

.bg_brown {
    background-color: #f5ede6;
}

.bg_blue {
    display: inline-block;
    background-color: #d0eaf6;
    padding: 5px 10px;
}

.link_gmap {
    display: inline-block;
    background-image: url("../img/ic_gmap.svg");
    background-position: center right;
    background-repeat: no-repeat;
    background-size: 15px auto;
    padding-right: 20px;
}

.img-list {
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin: 0;
}

.img-list li {
    display: block;
    text-align: center;
    margin:0 5px 0 0;
}

.img-list li:last-child {
    margin: 0;
}

.img-list-c {
    display: flex;
    justify-content: center;
    list-style: none;
    margin: 0;
}

.img-list-c li {
    display: block;
    text-align: center;
    margin:0 5px;
}

.t-tel a {
    font-size: 2.5rem;
    color: #1695d4;
    font-weight: bold;
    background-image: url("../img/ic_tel.svg");
    background-repeat: no-repeat;
    background-position: center left;
    background-size: 35px auto;
    padding: 0 0 0 45px;
}


/*------------------------------------------
  Responsive Grid Media Queries - 1280, 1024, 768, 480
   1280-1024   - デスクトップ(デフォルトのグリッド)
   1024-768    - タブレット横長
   768-480     - タブレット縦長
   480-less    - スマホ
--------------------------------------------*/
@media all and (min-width: 1024px) and (max-width: 1280px) {



}

@media all and (min-width: 768px) and (max-width: 1024px) {

body {
    padding-top: 0;
}

.container {
    width: 100% !important;
}

img {
	max-width: 100%;
	height:auto;
}



/* パンくず */
.bc_nav {
	margin-top:10px;
}

}

@media screen and (min-width: 768px) {

body {
	padding:160px 0 0 0;
}

a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}

.container {
	width:1030px;
	margin: 0 auto 120px;
}

/* 北研について */

.sdgsbox h3 {
    display: block;
    height:33%;
}

.td_address {
    width: 70%;
}

/* 支援プログラム */

/** 法人・個人のお客様 **/

.col_lpfig01_01 {
    padding: 0 20px;
}

.col_lpfig01_02 {
    padding: 30px 20px 0 20px;
    border-left:2px dotted #ccc;
    border-right:2px dotted #ccc;
}

.arw_3:after {
    content: "";
    position: absolute;
    right:-20px;
    bottom:20px;
    width:12px;
    height: 20px;
    background-color: #1da8a3;
    clip-path: polygon(0 0,100% 50%, 0 100%);
}

/* 生産者 */

.intv_pl {
    padding-left: 80px;
}

.intv_pr {
    padding-right: 80px;
}

/* 流通・販売 */

.ds_col01 {
    flex-basis: 100%;
    padding: 10px 100px;
    border-bottom: 2px dotted #FFF;
}

.ds_col02,.ds_col03 {
    flex-basis: 50%;
    padding: 30px 50px;
}

.ds_col02 {
    border-right: 2px dotted #FFF;
}

.ds_col04 {
    flex-basis: 100%;
    padding: 30px 100px 0;
    border-top: 2px dotted #FFF;
}

/* 汎用 */

.row_pc_nowrap {
    flex-wrap: nowrap !important;
}

.row-type01 .col-txt {
    margin: 0 40px;
}

.pc-center {
    text-align: center;
}

.img_right {
    float:right;
    width:33%;
    margin:0 0 20px 20px;
}

.table02 th {
    width:25%;
}

}

@media screen and (max-width: 767px) {

body {
	padding:72px 0 0 0;
}

/* サイト内共通 */

.container {
	width:100%;
	padding:0 15px;
}

.narrow {
    width: 100%;
    margin: 0 auto;
}

.table th,
.table td {
	padding:8px;
}

a.anchor {
    display: block;
    padding-top: 60px;
    margin-top: -60px;
}

.link_btn_w,.link_btn_w a {
    margin: 0 auto;
}

.row {
    justify-content: space-between;
}

.row-sm {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

/* 固定ページ・投稿共通 */

main {
    padding: 40px 0 0;
    background-position: top right -40px !important;
}

/* 固定ページ共通 */

#page h1 {
    font-size: 1.9rem;
    margin-bottom: 1.5em;
}

#page h2 {
    font-size: 1.8rem;
    margin-bottom: 1.5rem;
}

.h_type05 {
	font-size:4.7vw;
}

/* お知らせ一覧 */

.news_list {
	flex-wrap: wrap;
    margin-bottom: 0px;
}

.news_item {
    flex-basis: 48%;
    margin-bottom: 30px;
}


/* 固定ページ共通 */

#bc_nav {
	font-size: 80%;
	margin-bottom: 30px;
}

#main {
	margin-bottom: 60px;
}

.entry img {
	margin-bottom: 5px;
}

.page .entry table {
    font-size: 0.9rem;
}

.cf_navi {
    display: flex;
    justify-content: space-around;
    flex-direction: column-reverse;
    flex-wrap: wrap;
    list-style: none;
    margin: 0;
}

.cf_navi li {
    display: block;
    flex-basis: 80%;
    margin: 0 0 20px;
}

/* コンテンツ別 */

/* 北研について */

main.corporate {
    background-position: top right -10%;
    background-size: 50% auto;
}

.cp_greeting {
    background-position: bottom center;
    background-size: 50% auto;
    padding-bottom: 45%;
}

.cp_greeting .col-txt {
    padding-bottom: 20px;
}

.ov_img_row {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    width:100%;
}

.ov_img {
    flex-basis: 31%;
    margin-bottom: 20px;
}

.sdgsbox {
    margin: 0 0 30px;
}

.sdgsbox h3 {
    margin-bottom: 20px;
}

/* 研究開発 */

.tecbox {
    padding:40px;
}

/* 種菌製造 */

.flow02 li.with-arrow01,.flow02 li.with-arrow02 {
    margin-bottom: 40px;
}

.flow02 li.with-arrow01:after,
.flow02 li.with-arrow02:after {
    content: "";
    position: absolute;
    bottom:-25px;
    left:50%;
    transform: translateX(-50%);
    width:30px;
    height: 15px;
    background-color: #4d73ab;
    clip-path: polygon(0 0,100% 0, 50% 100%);
}

/* 流通・販売 */

.ds_col01 {
    flex-basis: 100%;
    padding: 10px 10px;
    border-bottom: 2px dotted #FFF;
}

.ds_col02,.ds_col03 {
    flex-basis: 100%;
    padding: 30px 10px;
    border-bottom: 2px dotted #FFF;
}

.ds_col04 {
    flex-basis: 100%;
    padding: 30px 10px 0;
}

/* 支援プログラム */

.cat_nav_farmers li {
    flex-basis: 48%;
}

.dl_list li {
    flex-basis: 100%;
}

/** 法人・個人のお客様 **/

.col_lpfig01_01 {
    padding: 0;
}

.col_lpfig01_02 {
    padding: 30px 10px 0 10px;
    border-left:2px dotted #ccc;
    border-right:2px dotted #ccc;
}

.h_lpfig02 {
    background-size: 40% auto;
}

.col-lpfig02:before {
    content: "";
    display: block;
    position: absolute;
    width:20px;
    height:20px;
    bottom:-25px;
    right:0;
    border: 1px solid #ccc;
    border-radius: 50%;
}

.col-lpfig02:after {
    content: "";
    display: block;
    position: absolute;
    width:10px;
    height:10px;
    bottom:-35px;
    right:0;
    border: 1px solid #ccc;
    border-radius: 50%;
}

.lpfig03_t {
    margin-bottom: 10px;
}

.lpfig03_t:after {
    background-color: transparent;
}

.col_face {
    margin-bottom: 20px !important;
}

.col_voice_r,.col_voice_l {
    padding:20px 0;
    border-top:1px solid #333;
    border-left:transparent;
    border-right:transparent;
}

.col_voice_r:before,.col_voice_l:before {
    content:"";
    position: absolute;
    width:32px;
    height:3px;
    top:-2px;
    left:50%;
    transform: translateX(-50%);
    background-color: #f5ede6;
}

.col_voice_r:after,.col_voice_l:after {
    content:"";
    position: absolute;
    width:24px;
    height:24px;
    left:50%;
    transform: translateX(-50%) rotate(60deg);
    top:-9px;
    border-left:1px solid #333;
    border-right:transparent;
}

.flow03 {
    padding: 10px;
    margin-bottom: 10px;
}

.flow03 span {
    position: relative;
}

.with-arrow03:after {
    left:50%;
    transform: translateX(-50%);
}

.arw_2:after {
    content: "";
    position: absolute;
    right:-20px;
    bottom:20px;
    width:12px;
    height: 20px;
    background-color: #1da8a3;
    clip-path: polygon(0 0,100% 50%, 0 100%);
}

.sunmush_nav {
    flex-wrap: wrap;
}

.sunmush_nav li {
    flex-basis: 48%;
    margin-bottom: 20px;
}

/* 汎用　*/

.sp-center {
    text-align: center;
}

.col-img {
    margin-bottom: 10px;
}

.sc-table {
    min-width: 1000px;
}

.s-narrow {
    width: 100%;
    margin: 0 auto;
}

.row-type01 {
    flex-wrap: wrap;
}

.dl-table dt {
    flex-basis: 100%;
    padding:15px 0 5px;
    border-bottom: 0;
}

.dl-table dd {
    flex-basis: 100%;
    padding:5px 0 15px;
    border-bottom:1px solid #ddd;
}

.table01 {
    font-size: 0.9rem;
}

.table02,.table02 th,.table02 td {
    display: block;
}

.table02 th {
    width:100%;
    border-right: transparent;
    border-bottom: 1px solid #ccc;
    padding: 10px 0;
}

.table02 td {
    width: 100%;
    padding: 10px 0 0;
}

.table03 {
    font-size: 0.9rem;
}

.table03 th,
.table03 td {
    padding: 10px;
}

.table04 {
    font-size: 0.9rem;
}

.table04 th,
.table04 td {
    padding: 10px;
}

.table-responsive {
    display: block;
    width: 100%;
}

.table-responsive tbody,
.table-responsive tr {
    display: block !important;
    width: 100%;
}

.table-responsive th,.table-responsive td {
    display: block;
    width: 100%;
}

.tr_table01 th {
    display: none !important;
}

.tr_col01 {
    background-color: #8acae9;
}

.tr_col00 {
    border-top:transparent !important;
}

.box01 {
    padding:15px;
}

.box06 {
    padding:40px;
}

.img-right {
    margin:0 0 10px 20px;
}

.img-list {
    justify-content: flex-start;
}

}


@media screen and (max-width: 480px) {

section {
	padding:40px 0;
}

.h_type01 {
	font-size:1.8rem;
}

.h_type02 {
	font-size:1.8rem;
}

.copy01 {
    font-size: 1.3rem;
}

.copy02 {
    font-size: 1.2rem;
}

/* 下層共通 */

main {
    background-position: top right -20px !important;
}

/* 固定ページ */

#page h2 {
    font-size: 1.6rem;
    margin-bottom: 15px;
}
	
.page .entry > h2,
.page .entry > .narrow h2 {
    font-size:1.5rem;
}

/* 北研について */

.ov_img {
    flex-basis: 47%;
    margin-bottom: 20px;
}

.table_ov td {
    padding-right: 10px;
}

/* 研究開発 */

.tecbox {
    padding:20px;
}

.tecbox_title01 {
    width:260px;
    margin: -50px auto 50px;
    padding: 0;
}

.tecbox_title_num {
    font-size: 1.6rem;
    width:50px;
    height:50px;
    padding: 8px 0 0;
    margin-right: 10px;
}

.tecbox_title_num span {
    font-size: 0.7rem;
}

.tecbox_title01 h4 {
    display: block;
    color: #826e50;
    font-size: 1.3rem;
    padding: 15px 0 0;
}

/* 支援プログラム */

.prg_item03 .col-txt {
    padding: 15px 0 0;
}

/** 法人・個人の皆さま **/

.lp_mimg {
    padding: 20px 0;
    background-position: center right -100px;
}

.t_copy {
    width: 70%;
}

.col_lpfig01_01 {
    padding: 20px 0;
}

.col_lpfig01_02 {
    padding: 30px 0;
    border-left:transparent;
    border-right:transparent;
    border-top:2px dotted #CCC;
    border-bottom:2px dotted #CCC;
}

.arw_1:after {
    content: "";
    position: absolute;
    left:50%;
    transform: translateX(-50%);
    bottom:-20px;
    width:20px;
    height: 12px;
    background-color: #1da8a3;
    clip-path: polygon(0 0,100% 0, 50% 100%);
}

.sunmush_nav li {
    flex-basis: 100%;
    margin-bottom: 20px;
}

.sunmush_nav li a:has(span) {
    padding: 40px 0;
}

/* お知らせ */

.news_list {
	flex-wrap: wrap
}

.news_item {
    flex-basis: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

.news_item .news_thumb {
    width:50%;
    aspect-ratio: auto ;
    overflow: hidden;
}

.news_item .news_thumb img {
    width: auto;
    height:100%;
}

.news_item .news_txt {
    width: 50%;
}

/* 共通 */

.table00,
.table00 tr,
.table00 th,
.table00 td {
    display: block;
}

.table00 th {
    padding: 10px 0 5px;
}

.table00 td {
    padding: 5px 0 10px;
}

.row_rev {
    flex-direction: row;
}

.box04 {
    padding:20px;
}

.box06 {
    padding:40px 20px;
}

}