@charset "utf-8";




/*リセットCSS（sanitize.css）の読み込み
---------------------------------------------------------------------------*/
@import url("https://unpkg.com/sanitize.css");

/*lightbox.cssの読み込み
---------------------------------------------------------------------------*/
@import url(https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.10.0/css/lightbox.css);

/*Font Awesomeの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css");

/*Google Fontsの読み込み
---------------------------------------------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Display&display=swap');

/*テンプレート専用cssファイルの読み込み
---------------------------------------------------------------------------*/
@import url("animation.css");



/*全体の設定
---------------------------------------------------------------------------*/
html,
body {
	margin: 0;
	padding: 0;
	height: 100vh;
	font-size: 14px;
	/*基準となるフォントサイズ。下の方にある「画面幅900px以上」で基準を大きなサイズに再設定しています。*/
}

body {
	font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	/*フォント種類*/
	-webkit-text-size-adjust: none;
	background: #fff url(../images/bg.jpg) repeat center center/200px;
	color: #ccc;
	/*全体の文字色*/
	line-height: 2;
	/*行間*/
}

/*リセット*/
figure {
	margin: 0;
}

dd {
	margin: 0;
}

nav {
	margin: 0;
	padding: 0;
}

/*table全般の設定*/
table {
	border-collapse: collapse;
}

/*画像全般の設定*/
img {
	border: none;
	max-width: 100%;
	height: auto;
	vertical-align: middle;
}

/*videoタグ*/
video {
	max-width: 100%;
}

/*iframeタグ*/
iframe {
	width: 100%;
}

/*ul,olタグ*/
ul,
ol {
	margin-bottom: 30px;
}

/*カラー*/
.red {
	color: #f00;
}

/*改行の設定
---------------------------------------------------------------------------*/
.pc {
	display: block !important;
}

.sp {
	display: none !important;
}

@media screen and (max-width: 750px) {
	.pc {
		display: none !important;
	}

	.sp {
		display: block !important;
	}
}

/*リンクテキスト全般の設定
---------------------------------------------------------------------------*/
a {
	color: #ccc;
	/*文字色*/
	transition: 0.3s;
}

a:hover {
	opacity: 0.8;
	/*マウスオン時に60%の透明度にする*/
}

/*hamburger menu
---------------------------------------------------------------------------*/
a {
	font-family: sans-serif;
	text-decoration: none;
}

.humberger {
	display: block;
	height: 60px;
	margin-left: auto;
	position: relative;
	z-index: 10;
	width: 60px;
	border: none;
	background-color: transparent;
}

.humberger.-active .humberger__line {
	background-color: transparent;
}

.humberger.-active .humberger__line::before {
	top: 0;
	transform: rotate(45deg);
}

.humberger.-active .humberger__line::after {
	top: 0;
	transform: rotate(-45deg);
}

.humberger.-active .humberger__text::before {
	content: '閉じる';
}

.humberger__line {
	display: block;
	height: 2px;
	position: absolute;
	top: 23px;
	left: 50%;
	transform: translateX(-50%);
	width: 24px;
	background-color: #172e59;
	transition: 0.4s;
}

.humberger__line:before,
.humberger__line:after {
	content: "";
	display: block;
	height: 100%;
	position: absolute;
	width: 100%;
	background-color: #172e59;
	transition: inherit;
}

.humberger__line:before {
	top: -6px;
}

.humberger__line:after {
	top: 6px;
}

.humberger__text {
	position: absolute;
	bottom: 8px;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
}

.humberger__text::before {
	content: "メニュー";
	text-align: center;
	color: #172e59;
	font-size: 10px;
	font-weight: 900;
}

.header {
	width: 300px;
}

.header__nav-area {
	position: fixed;
	top: 0;
	left: -100%;
	z-index: 9;
	height: 100vh;
	width: 300px;
	visibility: hidden;
	padding-top: 60px;
	background-color: rgba(255, 255, 255, 0.9);
	transition: 0.4s;
}

.header__nav-area.-active {
	left: 0;
	visibility: visible;
}

.global-navigation {
	padding-top: 40px;
	padding-right: 25px;
	padding-bottom: 120px;
	padding-left: 25px;
}

.global-navigation__list>li {
	padding-bottom: 20px;
	border-bottom: 2px solid #e7e9ee;
}

.global-navigation__list>li+li {
	margin-top: 20px;
}

.global-navigation__link {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #172e59;
	font-weight: 900;
	transition: color 0.4s;
	font-size: 0.875rem;
}

.global-navigation__link.-accordion {
	position: relative;
	background: none;
	border: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	width: 100%;
	padding: 0;
}

.global-navigation__link.-accordion::after {
	content: '';
	display: block;
	height: 12px;
	position: absolute;
	top: 50%;
	right: 5px;
	width: 2px;
	background-color: #ed3242;
	transform: translateY(-50%);
	transition: transform 0.4s;
}

.global-navigation__link.-accordion::before {
	content: '';
	display: block;
	height: 2px;
	position: absolute;
	top: 50%;
	right: 0;
	width: 12px;
	background-color: #ed3242;
	transform: translateY(-50%);

}

.global-navigation__link.-active::after {
	transform: translateY(-50%) rotate(-90deg);
}

.accordion {
	height: 0;
	overflow: hidden;
	visibility: hidden;
	transition: 0.4s;
}

.accordion.-active {
	height: auto;
	padding-top: 30px;
	visibility: visible;
}

.accordion__list li {
	font-size: 0.75rem;
}

.accordion__list li+li {
	margin-top: 21px;
}

.accordion__link {
	color: #172e59;
}


/*メインイメージ（bg_main.jpgを読み込んでいます）
---------------------------------------------------------------------------*/
#mainimg {
	text-indent: -9999px;
	position: fixed;
	top: 0px;
	z-index: -1;
	width: 100%;
	height: 100%;
	background: url(../images/bg_main.jpg) no-repeat center center / cover;
}

/*ヘッダー
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
header {
	height: 100px;
	/*高さ*/
}

.top_bar {
	height: 100px;
	background-color: #fff;
}

.top_bar .logo_txt {
	position: absolute;
	top: 0;
	left: 0;
	width: 65%;
}

.header__inner {
	padding-top: 5%;
}

/*ロゴ画像*/
header #logo {
	width: 50vw;
	height: 50vh;
	margin: 0 auto;
	position: relative;
}

header #logo .img_space {
	width: 100%;
	height: 100%;
	top: 50%;
	margin: 0 auto;
	position: absolute;
}


/*メインメニュー
---------------------------------------------------------------------------*/
/*メニュー１個あたりの設定*/
#menubar li {
	display: inline-block;
	transition: 0.5s;
	animation: opa1 1.5s both;
	/*animation.cssの、opa1を実行する。1.5sは1.5秒の事。*/
	text-align: center;
	font-size: 1em;
	/*文字サイズ*/
	position: fixed;
	/*画面に対して固定表示*/
	box-shadow: 0px 0px 30px rgba(0, 0, 0, 0.3);
	/*ボックスの影。右へ、下へ、ぼかし幅。0,0,0は黒の事で0.3は色が30%出た状態。*/
}

#menubar li a {
	display: block;
	text-decoration: none;
	color: #000;
	/*文字色*/
}

/*以下のGoogle Fontsを使う。*/
#menubar li {
	font-family: 'Hina Mincho', cursive;
}

/*マウスオン時*/
#menubar li:hover {
	transform: scale(1.05);
	/*105%に拡大*/
	filter: brightness(1.1);
	/*少しだけ明るくする*/
}

/*１つ目のメニュー(About)*/
#menubar li:nth-of-type(1) {
	left: 1%;
	/*ウィンドウに対して左からの配置場所*/
	top: 20%;
	/*ウィンドウに対して上からの配置場所*/
	animation-delay: 0.2s;
	/*0.2秒だけ遅れてアニメーションをスタートさせる設定*/
	background: #fff;
	/*背景色*/
	width: 100px;
	/*幅*/
	line-height: 100px;
	/*高さ*/
}

/*２つ目のメニュー(Gallery)*/
#menubar li:nth-of-type(2) {
	left: 1%;
	/*ウィンドウに対して左からの配置場所*/
	top: 35%;
	/*ウィンドウに対して上からの配置場所*/
	animation-delay: 0.4s;
	/*0.4秒だけ遅れてアニメーションをスタートさせる設定*/
	background: #fff;
	/*背景色*/
	width: 100px;
	/*幅*/
	line-height: 100px;
	/*高さ*/
}

/*３つ目のメニュー(Link)*/
#menubar li:nth-of-type(3) {
	left: 1%;
	/*ウィンドウに対して左からの配置場所*/
	top: 50%;
	/*ウィンドウに対して上からの配置場所*/
	animation-delay: 0.6s;
	/*0.6秒だけ遅れてアニメーションをスタートさせる設定*/
	background: #fff;
	/*背景色*/
	width: 100px;
	/*幅*/
	line-height: 100px;
	/*高さ*/
}

/*４つ目のメニュー(Link)*/
#menubar li:nth-of-type(4) {
	left: 1%;
	/*ウィンドウに対して左からの配置場所*/
	top: 65%;
	/*ウィンドウに対して上からの配置場所*/
	animation-delay: 0.6s;
	/*0.6秒だけ遅れてアニメーションをスタートさせる設定*/
	background: #fff;
	/*背景色*/
	width: 100px;
	/*幅*/
	line-height: 100px;
	/*高さ*/
}

/*５つ目のメニュー(Link)*/
#menubar li:nth-of-type(5) {
	left: 1%;
	/*ウィンドウに対して左からの配置場所*/
	top: 80%;
	/*ウィンドウに対して上からの配置場所*/
	animation-delay: 0.6s;
	/*0.6秒だけ遅れてアニメーションをスタートさせる設定*/
	background: #fff;
	/*背景色*/
	width: 100px;
	/*幅*/
	line-height: 100px;
	/*高さ*/
}




/*コンテンツ
---------------------------------------------------------------------------*/
/*コンテンツ共通*/
.contents {
	overflow: hidden;
	padding: 0 5% 50px 5%;
	/*ボックス内の余白。上、右、下、左。*/
	width: 100%;
}

.contents02 {
	overflow: hidden;
	padding: 0;
	/*ボックス内の余白。上、右、下、左。*/
	width: 100%;
}

/*まずはお決まりのボックスサイズ算出をborer-boxに */
*,
*:before,
*:after {
	-webkit-box-sizing: inherit;
	box-sizing: inherit;
}

html {
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	font-size: 62.5%;
	/*rem算出をしやすくするために*/
}

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

.contact_space .btn_area {
	margin: 0 auto 3% 0;
}

.btn,
a.btn,
button.btn {
	font-size: 1.6rem;
	font-weight: 700;
	line-height: 1.5;
	position: relative;
	display: inline-block;
	padding: 1rem 4rem;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	text-align: center;
	vertical-align: middle;
	text-decoration: none;
	letter-spacing: 0.1em;
	color: #212529;
	border-radius: 0.5rem;
}

a.btn--dark-yellow {
	color: #fff;
	background-color: #a58d00;
}

a.btn--dark-yellow:hover {
	color: #fff;
	background: #ffd100;
}


a.btn--black {
	color: #fff;
	background: #000;
	font-size: 90%;
	border-radius: none;
	font-family: sans-serif !important;
}

a.btn--black:hover {
	color: #000;
	background: #fff;
}


a.btn--dark-yellow.btn--cubic {
	border-bottom: 5px solid #6c5716;
}

a.btn--dark-yellow.btn--cubic:hover {
	margin-top: 3px;
	border-bottom: 2px solid #6c5716;
}

a.btn-c {
	font-size: 1.2rem;
	position: relative;
	padding: 1.5rem 6rem 1.5rem 4rem;
	border-radius: 100vh;
}

a.btn-c i.fa {
	margin-right: 1rem;
}

a.btn-c:before {
	font-family: 'Font Awesome 5 Free';
	font-size: 1.6rem;
	line-height: 1;
	position: absolute;
	top: calc(50% - .8rem);
	right: 1rem;
	margin: 0;
	padding: 0;
	content: '\f054';
}


/*main
---------------------------------------------------------------------------*/
/*h2見出し*/
main h2 {
	font-size: 2em;
	/*文字サイズ*/
	margin-bottom: 20px;
	/*下に空ける余白*/
	text-align: center;
	/*文字をセンタリング*/
	letter-spacing: 0em;
	/*文字間隔を広くとる設定*/
}

/*h2見出しの上の装飾*/
main h2::before {
	content: "＊";
	/*好きな装飾文字に変えてもらって構いませんが機種依存文字は化けるので使わない*/
	display: block;
	text-shadow: 20px 10px 0px rgba(255, 255, 255, 0.5);
	/*影。右に、下に、ぼかし幅。255,255,255は白の事で0.5は色が50%出た状態の事。*/
}

/*h2見出し内のspanタグ*/
main h2 span {
	display: block;
	font-size: 0.7em;
	/*文字サイズ*/
}

/*h3見出し*/
main h3 {
	margin-bottom: 20px;
	/*下に空ける余白*/
	letter-spacing: 0.1em;
	/*文字間隔を広くとる設定*/
	background: #fff;
	/*背景色（古いブラウザ用）*/
	background: rgba(255, 255, 255, 0.3);
	/*255,255,255は白の事で0.3は色が30%出た状態の事。*/
	text-align: center;
	/*文字を中央に*/
	border-radius: 30px;
	/*角丸のサイズ。大きめに設定しておけばOK。*/
	padding: 0px 20px;
	/*上下、左右への余白*/
}


/*段落タグ*/
main p {
	padding: 0 30px 30px;
	/*上、左右、下への余白*/
}

/*bg1スタイルのついたコンテンツ*/
.bg1 {
	background: url(../images/bg1.jpg) repeat center top/ 200px;
	/*背景画像*/
}

.block {
	display: flex;
	flex-direction: column;
	width: 90%;
	margin: 2% auto;
}

.block .left_image {
	width: 100%;
}

.block .right_text {
	width: 100%;
	margin-top: 10%;
}

.block .right_text dl {
	display: flex;
	flex-wrap: wrap;
	margin: 0 0 3% 0;
	border: 1px solid rgba(255, 255, 255, 0.3);
	;
}

.block .right_text dt {
	width: 25%;
	padding: 3px;
	background: rgba(255, 255, 255, 0.3);
	/*255,255,255は白の事で0.3は色が30%出た状態の事。*/
	margin: 0 10px 0px 0px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.1em;
}

.block .right_text dd {
	width: 65%;
	padding: 3px;
	margin: 0 0 0px 0;
	font-size: 1.1em;
}

.block .right_text p {
	margin: 0 0 10% 0;
	padding: 0;
	text-align: left;
	font-feature-settings: "palt";
}

.block .right_text .lh_2 {
	margin: 0 0 10% 0;
	padding: 0;
	text-align: left;
	font-feature-settings: "initial";
	line-height: 2em;
}

.block .right_text .lh_2 .indent-1 {
	padding-left: 1em;
	text-indent: -1em;
}

.block .right_text .lh_2 a {
	background-color: #fff;
	padding: 1.5% 3%;
	color: #000;
	border-radius: 15px;
}

/*bg2スタイルのついたコンテンツ*/
.bg2 {
	background: url(../images/bg2.jpg) repeat center top/ 200px;
	/*背景画像*/
}

.process_area .process_contents {
	display: flex;
	flex-direction: column;
	margin: 5% auto 0 auto;
}

.process_area .process_contents .process_photo {
	width: 85%;
	margin: 0 auto 5% auto;
}

.process_area .process_contents .process_photo img {
	width: 100%;
}

.process_area .process_contents .process_txt {
	width: 100%;
	text-align: left;
	margin: 0 auto;
	padding: 0;
	line-height: 3rem;
}

.process_area .process_contents .process_txt p {
	margin-top: 0;
}

.process_area .allow_icon {
	margin: 0% auto 10% auto;
	width: 15%;
}

/*bg3スタイルのついたコンテンツ*/
.bg3 {
	background: url(../images/bg3.jpg) repeat center top/ 200px;
	/*背景画像*/
}

/*bg4スタイルのついたコンテンツ*/
.bg4 {
	background: url(../images/bg4.jpg) repeat center top/ 200px;
	/*背景画像*/
}

/*bg5スタイルのついたコンテンツ*/
.bg5 {
	background: url(../images/bg4.jpg) repeat center top/ 200px;
	/*背景画像*/
}

/*bg6スタイルのついたコンテンツ*/
.bg6 {
	background: url(../images/2026_fishingfes/bg.webp) repeat-y center top;
	/*背景画像*/
}

/*news_articleブロック
---------------------------------------------------------------------------*/
/*listボックスを囲むボックス*/
.news_article_area {
	max-width: 1200px;
	margin: 0% auto;
	background-color: transparent;
}

.news_article_area .inner_area {
	text-align: center;
	margin: 0 auto;
	padding: 3% 0;
	max-width: 1080px;
}

.news_article_area .inner_area .fishingfes_mv {
	margin: 0 auto 5% auto;
	width: 100%;
}

.news_article_area .inner_area .comment {
	margin: 0 auto 5% auto;
	width: 100%;
}

/* コメントブロック全体 */
.news_article_area .inner_area .comment_block {
	margin: 0 auto 5% auto;
	max-width: 900px;
	padding: 0 3%;
}

/* 上部コメント吹き出し */
.news_article_area .inner_area .comment_block .comment_bubble {
	margin-bottom: 3%;
	text-align: left;
}

.news_article_area .inner_area .comment_block .comment_bubble img {
	max-width: 100%;
}

/* 組合長セクション */
.news_article_area .inner_area .comment_block .kumiaichou_section {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 5%;
}

.news_article_area .inner_area .comment_block .kumiaichou_photo {
	position: relative;
	max-width: 400px;
}

.news_article_area .inner_area .comment_block .kumiaichou_photo img {
	width: 100%;
	border-radius: 10px;
}

.news_article_area .inner_area .comment_block .kumiaichou_name {
	position: absolute;
	bottom: 15%;
	left: -30%;
	background: #fff;
	border: 2px solid #15a0c8;
	border-radius: 8px;
	padding: 10px 20px;
	text-align: center;
}

.news_article_area .inner_area .comment_block .kumiaichou_name .title {
	display: block;
	font-size: 0.8rem;
	color: #15a0c8;
	background: #e5f6fa;
	padding: 3px 10px;
	border-radius: 3px;
	margin-bottom: 5px;
}

.news_article_area .inner_area .comment_block .kumiaichou_name .name {
	display: block;
	font-size: 1.4rem;
	font-weight: bold;
	color: #15a0c8;
}

/* 壮志さんセクション */
.news_article_area .inner_area .comment_block .soushi_section {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 5%;
}

.news_article_area .inner_area .comment_block .soushi_comment {
	text-align: right;
	width: 100%;
	margin-bottom: 3%;
}

.news_article_area .inner_area .comment_block .soushi_comment img {
	max-width: 80%;
}

.news_article_area .inner_area .comment_block .soushi_photo {
	position: relative;
	max-width: 400px;
}

.news_article_area .inner_area .comment_block .soushi_photo img {
	width: 100%;
	border-radius: 10px;
}

.news_article_area .inner_area .comment_block .soushi_name {
	position: absolute;
	bottom: 10%;
	left: 50%;
	transform: translateX(-50%);
	background: #fff;
	border: 2px solid #15a0c8;
	border-radius: 8px;
	padding: 8px 25px;
	text-align: center;
}

.news_article_area .inner_area .comment_block .soushi_name .name {
	font-size: 1.2rem;
	font-weight: bold;
	color: #15a0c8;
}

/* スマホ対応 */
@media screen and (max-width: 767px) {
	.news_article_area .inner_area .comment_block .kumiaichou_section {
		justify-content: center;
	}

	.news_article_area .inner_area .comment_block .kumiaichou_photo {
		max-width: 100%;
	}

	.news_article_area .inner_area .comment_block .kumiaichou_name {
		left: 5%;
		bottom: 5%;
	}

	.news_article_area .inner_area .comment_block .soushi_section {
		align-items: center;
	}

	.news_article_area .inner_area .comment_block .soushi_comment img {
		max-width: 100%;
	}

	.news_article_area .inner_area .comment_block .soushi_photo {
		max-width: 100%;
	}
}

.news_article_area .inner_area .fishing_title {
	position: relative;
	padding: 1rem 2rem 1rem calc(0.3rem + 10px);
	background: #DFEFFB;
	max-width: 460px;
	height: 80px;
	margin: 0 auto 5% auto;
	color: #036EB7;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
}

.news_article_area .inner_area .fishing_title:before {
	position: absolute;
	top: 10px;
	left: -10px;
	width: 100%;
	height: 100%;
	content: '';
	border: 4px solid #036EB7;
}

.news_article_area .inner_area .fishing_title02 {
	position: relative;
	padding: 1rem 2rem 1rem calc(0.3rem + 10px);
	background-image: linear-gradient(90deg, rgba(223, 239, 251, 1), rgba(230, 252, 241, 1));
	max-width: 460px;
	height: 80px;
	margin: 0 auto 5% auto;
	color: #036EB7;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
}

.news_article_area .inner_area .fishing_title02:before {
	position: absolute;
	top: 10px;
	left: -10px;
	width: 100%;
	height: 100%;
	content: '';
	border: 4px solid;
	border-image: linear-gradient(to right, #036eb7, #15bde8) 1;
}

.news_article_area .inner_area .main_photo {
	width: 860px;
	border: 20px solid #FFF;
	box-shadow: 0 0 15px #bbb;
	margin: 0 auto 5% auto;
}

.news_article_area .inner_area .main_photo_txt {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 2.4rem;
	color: #000;
	text-align: left;
	max-width: 860px;
	margin: 0 auto;
}

.news_article_area .inner_area .main_photo_txt02 {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	font-size: 1.2rem;
	line-height: 2.4rem;
	color: #000;
	text-align: left;
	max-width: 860px;
	margin: 0 auto 5% auto;
}

.marker-yellow {
	background: linear-gradient(transparent 60%, #fff000 60%);
}

.news_article_area .inner_area .first_photo_area {
	display: flex;
	flex-wrap: wrap;
	max-width: 900px;
	margin: 5% auto;
	gap: 5%;
	justify-content: center;
}

.news_article_area .inner_area .first_photo_area .photo_item {
	width: 45%;
	border: 15px solid #FFF;
	box-shadow: 0 0 15px #bbb;
	margin-bottom: 5%;
}

.news_article_area .inner_area .first_photo_area .photo_item02 {
	width: 45%;
	border: 15px solid #FFF;
	box-shadow: 0 0 15px #bbb;
	margin-bottom: 8%;
}

.news_article_area .inner_area .first_photo_area .photo_item03 {
	width: 28.5%;
	border: 10px solid #FFF;
	box-shadow: 0 0 10px #bbb;
	margin-bottom: 5%;
}

.news_article_area .inner_area .first_photo_area .photo_item02 .photo_exp {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	font-size: 1rem;
	line-height: 1.6rem;
	color: #000;
	text-align: left;
	padding: 0;
}

.news_article_area .inner_area .last_copy {
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 500;
	font-size: 1.3rem;
	line-height: 2.4rem;
	color: #000;
	text-align: center;
	padding: 0;
}

.news_article_area .inner_area .sign_area {
	text-align: right;
	width: 300px;
	margin: 5% 11% 5% auto;
}

.news_article_area .inner_area .btn_area {
	margin: 5% auto 10% auto;
}

.news_article_area .inner_area .btn_area02 {
	margin: 2% auto 3% auto;
}

a.btn--blue {
	color: #036EB7;
	border: 2px solid #036EB7;
}

a.btn--blue:hover {
	color: #fff;
	background: #036EB7;
}

a.btn--gold {
	color: #fff;
	border: 2px solid #c9a063;
	background: #c9a063;
}

a.btn--gold:hover {
	background: #c9a063;
}

a.btn--white {
	color: #fff;
	border: 2px solid #fff;
	font-size: 90%;
}

a.btn--white:hover {
	color: #000;
	background: #fff;
}

a.btn-c {
	font-size: 1.2rem;
	position: relative;
	padding: 0.7rem 6rem;
	border-radius: 100vh;
}

a.btn-d {
	font-size: 1.2rem;
	position: relative;
	padding: 0.7rem 6rem;
	border-radius: none !important;
	width: 40%;
}

a.btn-c i.f0da {
	margin-right: 1rem;
	font-size: 1.4rem;
}

@media screen and (max-width: 767px) {
	.news_article_area .inner_area .comment {
		width: 80%;
		margin-bottom: 8%;
	}

	.news_article_area .inner_area .fishing_title {
		position: relative;
		padding: 2.4rem 2rem 1rem calc(0.3rem + 10px);
		background: #DFEFFB;
		max-width: 70%;
		height: 70px;
		margin: 0 auto 10% auto;
		color: #036EB7;
		font-size: 1.6rem;
	}

	.news_article_area .inner_area .fishing_title:before {
		position: absolute;
		top: 10px;
		left: -10px;
		width: 100%;
		height: 100%;
		content: '';
		border: 4px solid #036EB7;
	}

	.news_article_area .inner_area .fishing_title02 {
		position: relative;
		padding: 2.4rem 2rem 1rem calc(0.3rem + 10px);
		max-width: 70%;
		height: 70px;
		margin: 0 auto 10% auto;
		color: #036EB7;
		font-size: 1.6rem;
	}

	.news_article_area .inner_area .fishing_title02:before {
		position: absolute;
		top: 10px;
		left: -10px;
		width: 100%;
		height: 100%;
		content: '';
	}

	.news_article_area .inner_area .main_photo {
		width: 90%;
		border: 15px solid #FFF;
		box-shadow: 0 0 10px #bbb;
	}

	.news_article_area .inner_area .main_photo_txt {
		font-size: 1.2rem;
		line-height: 2rem;
	}

	.news_article_area .inner_area .main_photo_txt02 {
		font-size: 1.2rem;
		line-height: 2rem;
	}

	.news_article_area .inner_area .first_photo_area {
		flex-direction: column;
		margin: 0 auto 5% auto;
	}

	.news_article_area .inner_area .first_photo_area .photo_item {
		width: 90%;
		margin: 5% auto;
	}

	.news_article_area .inner_area .first_photo_area .photo_item02 {
		width: 90%;
		margin: 5% auto;
	}

	.news_article_area .inner_area .first_photo_area .photo_item03 {
		width: 90%;
		margin: 5% auto;
	}

	.news_article_area .inner_area .first_photo_area .photo_item02 .photo_exp {
		font-size: 1.2rem;
		line-height: 1.8rem;
		color: #000;
		text-align: left;
		padding: 0;
	}

	.news_article_area .inner_area .last_copy {
		font-size: 1.4rem;
		line-height: 3rem;
		padding: 5%;
	}

	.bg6 {
		background: url(../images/2026_fishingfes/bg.webp) repeat-y center top;
		background-size: 100% auto;
	}

	.news_article_area .inner_area .sign_area {
		text-align: right;
		width: 60%;
		margin: 5% 5% 10% auto;
	}

	a.btn-c {
		font-size: 1.6rem;
		position: relative;
		padding: 1rem 6rem;
		border-radius: 100vh;
	}
}

/*Galleryブロック
---------------------------------------------------------------------------*/
/*listボックスを囲むボックス*/
.list-container {
	display: flex;
	/*flexボックスを使う指定*/
	flex-wrap: wrap;
	/*折り返す指定*/
	justify-content: space-between;
	/*並びかたの種類の指定*/
}

/*listボックス。１個あたりのボックスの指定です。*/
.list-container .list {
	display: flex;
	/*flexボックスを使う指定*/
	flex-direction: column;
	/*子要素を縦並びにする*/
	justify-content: space-between;
	/*並びかたの種類の指定*/
	margin-bottom: 30px;
	/*ボックス同士の上下間の余白*/
	border-radius: 10px;
	/*角丸のサイズ。中の画像が正方形であれば、10pxを50%にすることで円形にすることもできます。*/
	overflow: hidden;
	width: 22%;
	/*幅。１行に何個配置したいか、ここの数値を変更してお好みで調整して下さい。*/
}


/*「お知らせ」ブロック
---------------------------------------------------------------------------*/
/*お知らせブロック*/
#new {
	padding: 0 20px;
	/*上下、左右へのボックス内の余白*/
}

/*日付の横のマーク（共通設定）*/
#new dt span {
	display: none;
	/*小さな端末では非表示にしておく。*/
}

/*pdfアイコン*/
#new dd img {
	width: 10%;
	/*pdfアイコンのサイズ*/
	margin-left: 2%;
}

.movie_area {
	width: 100%;
	position: relative;
	padding-top: 56.25%;
}

.movie_area iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

/*フッター設定
---------------------------------------------------------------------------*/
footer small {
	font-size: 100%;
}

footer {
	font-size: 0.6em;
	/*文字サイズ*/
	text-align: center;
	/*内容をセンタリング*/
	padding: 20px;
	/*ボックス内の余白*/
	color: #fff;
	/*文字色*/
}

/*リンクテキスト*/
footer a {
	text-decoration: none;
	color: #fff;
}

/*著作部分*/
footer .pr {
	display: block;
}


/*テーブル
---------------------------------------------------------------------------*/
/*テーブル１行目に入った見出し部分（※caption）*/
.ta1 caption {
	font-weight: bold;
	/*太字に*/
	padding: 10px 5px;
	/*上下、左右へのボックス内の余白。基本的に数行下の「.ta1 th, .ta1 td」のpaddingと揃えておけばOKです。*/
	background: rgba(255, 255, 255, 0.2);
	margin-bottom: 15px;
	border-radius: 5px;
}

/*ta1テーブルブロック設定*/
.ta1 {
	border-top: 1px solid rgba(255, 255, 255, 0.5);
	/*テーブルの一番上の線。幅、線種、色*/
	width: 100%;
	margin: 0 auto 30px;
	/*最後の「30px」がテーブルの下に空けるスペースです*/
}

/*tr（１行分）タグ設定*/
.ta1 tr {
	border-bottom: 1px solid rgba(255, 255, 255, 0.5);
	/*テーブルの下線。幅、線種、色*/
}

/*th（左側）、td（右側）の共通設定*/
.ta1 th,
.ta1 td {
	padding: 10px 5px;
	/*上下、左右へのボックス内の余白*。基本的に数行上の「.ta1 caption」のpaddingと揃えておけばOKです。*/
	word-break: break-all;
	/*英語などのテキストを改行で自動的に折り返す設定。これがないと、テーブルを突き抜けて表示される場合があります。*/
}

/*th（左側）のみの設定*/
.ta1 th {
	width: 30%;
	/*幅*/
	text-align: left;
	/*左よせにする*/
}


/*PAGE TOP（↑）設定
---------------------------------------------------------------------------*/
.pagetop-show {
	display: block;
}

/*ボタンの設定*/
.pagetop a {
	display: block;
	text-decoration: none;
	text-align: center;
	position: fixed;
	/*スクロールに追従しない(固定で表示)為の設定*/
	z-index: 99;
	right: 20px;
	/*右からの配置場所指定*/
	bottom: 20px;
	/*下からの配置場所指定*/
	color: #fff;
	/*文字色*/
	font-size: 1.5em;
	/*文字サイズ*/
	background: rgba(0, 0, 0, 0.2);
	/*背景色。0,0,0は黒の事で0.2は色が20%出た状態。*/
	width: 60px;
	/*幅*/
	line-height: 60px;
	/*高さ*/
	border-radius: 50%;
	/*円形にする*/
}


/*その他
---------------------------------------------------------------------------*/
.clearfix::after {
	content: "";
	display: block;
	clear: both;
}

.color-theme,
.color-theme a {
	color: #74791b !important;
}

.color-check,
.color-check a {
	color: #f00 !important;
}

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

.ws {
	width: 95%;
	display: block;
}

.wl {
	width: 95%;
	display: block;
}

.mb30 {
	margin-bottom: 30px !important;
}

.look {
	display: inline-block;
	padding: 0px 10px;
	background: #666;
	color: #fff;
	border-radius: 3px;
	margin: 5px 0;
}

.look .color-check {
	color: #ffcc00 !important;
}

.small {
	font-size: 0.6em;
}





/*---------------------------------------------------------------------------
ここから下は画面幅370px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:370px) {


	/*「お知らせ」ブロック
---------------------------------------------------------------------------*/
	/*お知らせブロック*/
	#new {
		margin: 0;
		display: flex;
		/*flexボックスを使う指定*/
		flex-direction: column;
		flex-wrap: wrap;
		/*折り返す指定*/
	}

	/*日付(dt)、記事(dd)共通設定*/
	#new dt {
		padding: 5px 0 0 0;
		/*上下、左右へのボックス内の余白*/
	}

	#new dd {
		padding: 5px 0;
		/*上下、左右へのボックス内の余白*/
	}

	/*日付(dt)設定*/
	#new dt {
		width: 8em;
		/*幅。8文字(em)分。※下の「900px以上」の端末用の設定に再設定があります。*/
	}

	/*記事(dd)設定*/
	#new dd {
		width: 100%;
		/*「8em」は上の「#new dt」のwidthの値です。※下の「900px以上」の端末用の設定に再設定があります。*/
		margin-bottom: 5%;
		border-bottom: dashed 1px #999;
	}


	/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで下さい。　*/

}

/* iPadPro10.5 portrait */
@media screen and (min-width:430px) and (max-width: 834px) {

	/* CSS */
	.top_bar {
		height: 86px;
	}

	.top_bar .logo_txt {
		left: 10;
		width: 30%;
	}

	.header__inner {
		padding-top: 2%;
	}

	.block .right_text p {
		margin: 0 0 5% 0;
	}

	.process_area .allow_icon {
		margin: 0% auto 2% auto;
		width: 6%;
	}

	/*お知らせブロック*/
	#new {
		flex-direction: row;
	}

	/*pdfアイコン*/
	#new dd img {
		width: 5%;
		/*pdfアイコンのサイズ*/
		margin-left: 2%;
	}

}

/*---------------------------------------------------------------------------
ここから下は画面幅900px以上の追加指定
---------------------------------------------------------------------------*/
@media screen and (min-width:900px) {


	/*全体の設定
---------------------------------------------------------------------------*/
	html,
	body {
		font-size: 16px;
		/*基準となるフォントサイズの上書き*/
	}


	/*ヘッダー
---------------------------------------------------------------------------*/
	/*トップバー*/
	.top_bar {
		height: 104px;
	}

	.top_bar .logo_txt {
		width: 15%;
		max-width: 260px !important;
		left: 50px;
	}

	.header__inner {
		padding-top: 1%;
	}

	/*ロゴ画像*/
	header #logo {
		width: 25vw;
		height: 25vh;
	}

	header #logo .img_space {
		top: 100%;
	}


	/*メインメニュー
---------------------------------------------------------------------------*/
	/*メニュー１個あたりの設定*/
	#menubar li {
		font-size: 1em;
		/*文字サイズ*/
	}

	/*１つ目のメニュー(About)*/
	#menubar li:nth-of-type(1) {
		left: 5%;
		/*ウィンドウに対して左からの配置場所*/
		top: 25%;
		/*ウィンドウに対して上からの配置場所*/
		width: 100px;
		/*幅*/
		line-height: 100px;
		/*高さ*/
	}

	/*２つ目のメニュー(Gallery)*/
	#menubar li:nth-of-type(2) {
		left: 5%;
		/*ウィンドウに対して左からの配置場所*/
		top: 37%;
		/*ウィンドウに対して上からの配置場所*/
		width: 100px;
		/*幅*/
		line-height: 100px;
		/*高さ*/
	}

	/*３つ目のメニュー(Link)*/
	#menubar li:nth-of-type(3) {
		left: 5%;
		/*ウィンドウに対して左からの配置場所*/
		top: 49%;
		/*ウィンドウに対して上からの配置場所*/
		width: 100px;
		/*幅*/
		line-height: 100px;
		/*高さ*/
	}

	/*４つ目のメニュー(Link)*/
	#menubar li:nth-of-type(4) {
		left: 5%;
		/*ウィンドウに対して左からの配置場所*/
		top: 61%;
		/*ウィンドウに対して上からの配置場所*/
		width: 100px;
		/*幅*/
		line-height: 100px;
		/*高さ*/
	}

	/*５つ目のメニュー(Link)*/
	#menubar li:nth-of-type(5) {
		left: 5%;
		/*ウィンドウに対して左からの配置場所*/
		top: 73%;
		/*ウィンドウに対して上からの配置場所*/
		width: 100px;
		/*幅*/
		line-height: 100px;
		/*高さ*/
	}

	/*コンテンツ
---------------------------------------------------------------------------*/
	/*コンテンツ共通*/
	.contents {
		padding: 0 5% 0 5%;
		/*ボックス内の余白。上、右、下、左。*/
	}

	.herabuna_area {
		max-width: 1500px;
		margin: 0 auto;
	}

	.technology_area {
		max-width: 1500px;
		margin: 0 auto;
	}

	.block {
		flex-direction: row;
		gap: 50px;
	}

	.block .left_image {
		width: 50%;
	}

	.block .right_text {
		width: 45%;
		margin-top: 0;
	}

	.block .right_text dl {
		margin: 0 0 2% 0;
	}

	.block .right_text dt {
		margin: 0 40px 0px 0px;
		font-size: 1.1em;
	}

	.block .right_text dd {
		font-size: 1.1em;
	}

	.block .right_text p {
		margin: 0 0 4% 0;
	}

	.block .right_text .lh_2 {
		line-height: 2em;
	}

	.bg2 .p {
		text-align: center;
	}

	.process_area .process_contents {
		display: flex;
		flex-direction: row;
		width: 90%;
	}

	.process_area .process_contents .process_photo {
		width: 40%;
	}

	.process_area .process_contents .process_txt {
		width: 55%;
		text-align: left;
		margin: 0 0 0 3%;
		padding: 0;
		line-height: 2rem;
	}

	/*「お知らせ」ブロック
---------------------------------------------------------------------------*/
	#new {
		flex-direction: row;
	}

	/*日付(dt)設定*/
	#new dt {
		width: 14em;
		/*幅。14文字(em)分。*/
		display: flex;
		/*flexボックスを使う指定*/
		justify-content: space-between;
		/*日付とアイコンをそれぞれ端に寄せる*/
	}

	/*日付の横のマーク（共通設定）*/
	#new dt span {
		display: inline-block;
		/*表示させる*/
		width: 6em;
		/*幅。6文字(em)分。*/
		background: #999;
		/*背景色*/
		color: #fff;
		/*文字色*/
		font-size: 0.9em;
		/*文字サイズを90%に。*/
		text-align: center;
		/*文字をセンタリング*/
		border-radius: 3px;
		/*角を少しだけ丸くする*/
		margin-right: 1.2em;
		/*アイコンの右側に空けるスペース*/
		align-self: flex-start;
		/*高さを間延びさせない指定*/
		line-height: 1.8;
		/*行間を少し狭く*/
		position: relative;
		top: 0.4em;
		/*上下の配置バランスの微調整*/
	}

	/*bg1設定。サンプルテンプレートでは「Gallery」と書いてあるマーク*/
	#new dt span.icon-bg1 {
		background: #74791b;
		/*背景色*/
	}

	/*記事(dd)設定*/
	#new dd {
		width: calc(100% - 14em);
		/*「14em」は上の「#new dt」のwidthの値です。*/
		margin-bottom: 5%;
	}

	/*日付の横のマーク（共通設定）*/
	#new dd img {
		width: 4%;
		/*pdfアイコンのサイズ*/
		margin-left: 2%;
	}

	.movie_area {
		max-width: 800px;
		width: 90%;
		position: relative;
		padding-top: 30.25%;
		margin: 0 auto;
	}

	.movie_area iframe {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}

	.process_area {
		max-width: 1000px;
		margin: 0 auto;
	}

	.process_area .p {
		font-feature-settings: "palt";
		text-align: center;
	}

	.process_area .allow_icon {
		margin: 0% auto 5% auto;
		width: 8%;
	}

	.news_area {
		max-width: 1200px;
		margin: 5% auto;
	}

	.list-container {
		max-width: 1200px;
		margin: 5% auto;
	}

	.experience_area {
		max-width: 1400px;
		margin: 5% auto;
	}

	/*テーブル
---------------------------------------------------------------------------*/
	/*テーブル１行目に入った見出し部分（※caption）*/
	.ta1 caption {
		padding: 5px 15px;
		/*上下、左右へのボックス内の余白*/
	}

	/*th（左側）、td（右側）の共通設定*/
	.ta1 th,
	.ta1 td {
		padding: 20px 15px;
		/*上下、左右へのボックス内の余白*/
	}

	/*th（左側）のみの設定*/
	.ta1 th {
		width: 20%;
		/*幅*/
	}


	/*その他
---------------------------------------------------------------------------*/
	.ws {
		width: 48%;
		display: inline;
	}


	/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで下さい。　*/

}


/*============
nav
=============*/
nav {
	display: block;
	position: fixed;
	top: 0;
	left: -300px;
	bottom: 0;
	width: 300px;
	height: 420px;
	background-color: rgba(255, 255, 255, 0.8);
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	transition: all .5s;
	z-index: 3;
	opacity: 0;
}

.open nav {
	left: 0;
	opacity: 1;
}

nav .inner {
	padding: 25px;
}

nav .inner ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

nav .inner ul li {
	position: relative;
	margin: 0;
	border-bottom: 1px solid #333;
}

nav .inner ul li a {
	display: block;
	color: #333;
	font-size: 14px;
	padding: 1em;
	text-decoration: none;
	transition-duration: 0.2s;
}

nav .inner ul li a:hover {
	background: #e4e4e4;
}

@media screen and (max-width: 767px) {
	nav {
		left: -220px;
		width: 220px;
	}
}

/*============
  .toggle_btn
  =============*/
.toggle_btn {
	display: block;
	position: fixed;
	top: 30px;
	right: 30px;
	width: 30px;
	height: 30px;
	transition: all .5s;
	cursor: pointer;
	z-index: 3;
}

.toggle_btn span {
	display: block;
	position: absolute;
	left: 0;
	width: 30px;
	height: 2px;
	background-color: #333;
	border-radius: 4px;
	transition: all .5s;
}

.toggle_btn span:nth-child(1) {
	top: 4px;
}

.toggle_btn span:nth-child(2) {
	top: 14px;
}

.toggle_btn span:nth-child(3) {
	bottom: 4px;
}

.open .toggle_btn span {
	background-color: #fff;
}

.open .toggle_btn span:nth-child(1) {
	-webkit-transform: translateY(10px) rotate(-315deg);
	transform: translateY(10px) rotate(-315deg);
}

.open .toggle_btn span:nth-child(2) {
	opacity: 0;
}

.open .toggle_btn span:nth-child(3) {
	-webkit-transform: translateY(-10px) rotate(315deg);
	transform: translateY(-10px) rotate(315deg);
}

/*============
  #mask
  =============*/
#mask {
	display: none;
	transition: all .5s;
}

.open #mask {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #000;
	opacity: .8;
	z-index: 2;
	cursor: pointer;
}

/*---------------------------------------------------------------------------
ここから下は画面幅1024px以下、かつ画面が「横長」の場合の追加指定
---------------------------------------------------------------------------*/
@media screen and (max-width:1024px) and (orientation: landscape) {


	/*コンテンツ
	---------------------------------------------------------------------------*/
	/*コンテンツ共通*/

	.top_bar .logo_txt {
		width: 26%;
		max-width: none !important;
		left: 50px;
	}

	/*　※注意！　下の閉じカッコ　}　はこのブロックに必要なので、削除しないで下さい。　*/

}

/*---------------------------------------------------------------------------
オリジナルtシャツ販売 追記
---------------------------------------------------------------------------*/
.t-shrts_bg {
	background: #000;
}

@media screen and (max-width: 767px) {
	a.btn-d {
		width: 70%;
	}
}


/*---------------------------------------------------------------------------
釣りフェスティバル2025 新作ギャラリー 追記
---------------------------------------------------------------------------*/

.gallery_article_area {
	max-width: 1200px;
	height: 6150px;
	margin: 0% auto;
	background: url(../images/2025_fishingfes/bg02-min.png);
	background-size: contain;
	background-position: center center;
	background-repeat: repeat-y;
	padding: 0;
}

.gallery_article_area .inner_area {
	text-align: center;
	margin: 0 auto;
	padding: 0% 0;
	max-width: 1200px;
}

.gallery_article_area .inner_area .gallery_message {
	margin: 10% auto;
	width: 80%;
}

.gallery_article_area .inner_area .rod-area {
	margin: 10% auto;
	max-width: 1080px;
}

.gallery_article_area .inner_area .rod-area .rod-mass {
	margin: 10% auto;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	gap: 80px 50px;
	justify-content: center;
	height: 850px;
}

.gallery_article_area .inner_area .rod-area .rod-mass .rod-item-a {
	width: 25%;
	align-self: start;
}

.gallery_article_area .inner_area .rod-area .rod-mass .rod-item-b {
	width: 25%;
	align-self: center;
}

.gallery_article_area .inner_area .rod-area .rod-mass .rod-item-c {
	width: 25%;
	align-self: end;
}

@media screen and (max-width: 767px) {
	.gallery_article_area {
		width: 100%;
	}

	.gallery_article_area {
		width: 100%;
	}

	.gallery_article_area {
		max-width: 100%;
		height: 2222px;
		margin: 0% auto;
		background: url(../images/2025_fishingfes/bg02-min.png);
		background-size: contain;
		background-position: center center;
		background-repeat: repeat-y;
		padding: 0;
	}

	.gallery_article_area .inner_area .rod-area .rod-mass {
		gap: 20px 20px;
		height: 300px;
	}
}

.section {
	max-width: 100%;
	margin: 0 auto;
	padding: 20px 20px 500px;
	overflow-x: hidden;
}

.section p._a {
	font-size: 12px;
	font-weight: bold;
	margin: 30px 0 0;
}

.section p._a .link {
	display: inline-block;
	color: #607D8B;
	padding-left: 1.3em;
	text-indent: -1.3em;
}

.section p._a .link:before {
	content: '';
	display: inline-block;
	width: 5px;
	height: 5px;
	border-top: 2px solid #607D8B;
	border-right: 2px solid #607D8B;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	margin-right: 10px;
}

/*---------------------------------------------------------------------------
スクロールフェードアニメーション
---------------------------------------------------------------------------*/
.fadeLeft {
	opacity: 0;
	transform: translateX(-50px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

.fadeRight {
	opacity: 0;
	transform: translateX(50px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

.fadeUp {
	opacity: 0;
	transform: translateY(30px);
	transition: opacity 0.8s ease, transform 0.8s ease;
}

.fadeLeft.is-show,
.fadeRight.is-show,
.fadeUp.is-show {
	opacity: 1;
	transform: translate(0);
}