@media print{	
/*	#contents{color:red !important}*/
}



/* HOME */

/*  .main_logo {
    z-index:11;
    position: absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    width:50%;
    height:auto;
}
*/

.first_column_home{
		width:100%;
		position:relative;
		top:0;
		left:0;
		margin:0;
		padding:0;
		height:auto;

}

	.top_bg_img{
		position:relative;
		top:-50px;
		left:0;
		width:auto;
		height:0;
	}

	.top_bg_img img{
		height:clamp(600px , 50vw ,800px);
		position:relative;
		top:0;
		left:0;
		overflow: hidden;
		width:100%;
		padding:0;
		margin:0 auto;
		z-index:100;
		object-fit:cover;
		overflow: hidden;
}

  .main_imgBox {
		position:relative;
		top:-120px;
		left:0;
		width:100vw;
		height:clamp(600px , 50vw , 800px);
		overflow: hidden;
		position: relative;
		object-fit:cover;
		max-width: 100%;
}

  .main_img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-position: center center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 10;
	opacity: 0;
	animation-name: slide-fade;
	animation-duration: 20s;
	animation-iteration-count: infinite;
	transform: scale(1);
}

@keyframes slide-fade {
	0%{
		opacity: 0;
	}
	20%{
		opacity: 1;
	}
	80%{
		opacity: 0;
	transform: scale(1.5);
	}
/*
	75%{
		opacity: 1;
	}
*/
	100%{
		opacity: 0;
		z-index: 0;
	}
}
.main_img:first-of-type{
	background-image: url(../img/top_photo/01.jpg);
}
.main_img:nth-of-type(2){
	background-image: url(../img/top_photo/02.jpg);
	animation-delay: 10s;
}
/*
.main_img:nth-of-type(3){
	background-image: url(../img/top_photo/04.jpg);
	animation-delay: 10s;
}
*/
.main_img:last-of-type{
	background-image: url(../img/top_photo/05.jpg);
	animation-delay: 20s;
}



/*
    z-index:10;
    opacity: 0;
    width: 100%;
    height:800px;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 48s 0s infinite;
    animation: anime 48s 0s infinite; }

    .main_img:nth-of-type(2) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s; }

    .main_img:nth-of-type(3) {
      -webkit-animation-delay: 24s;
      animation-delay: 24s; }

    .main_img:nth-of-type(4) {
      -webkit-animation-delay: 36s;
      animation-delay: 36s; }

    .main_img:nth-of-type(5) {
      -webkit-animation-delay: 48s;
      animation-delay: 48s; }

    .main_img:nth-of-type(6) {
      -webkit-animation-delay: 60s;
      animation-delay: 60s; }
*/

/*
  .main_imgM {
    opacity: 0;
    width:100%;
    height:100%;
    object-fit: cover;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-animation: anime 36s 0s infinite;
    animation: anime 36s 0s infinite; }

    .main_imgM:nth-of-type(2) {
      -webkit-animation-delay: 6s;
      animation-delay: 6s; }

    .main_imgM:nth-of-type(3) {
      -webkit-animation-delay: 12s;
      animation-delay: 12s; }

    .main_imgM:nth-of-type(4) {
      -webkit-animation-delay: 18s;
      animation-delay: 18s; }

    .main_imgM:nth-of-type(5) {
      -webkit-animation-delay: 24s;
      animation-delay: 24s; }

    .main_imgM:nth-of-type(6) {
      -webkit-animation-delay: 30s;
      animation-delay: 30s; }



@keyframes anime {
    0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
         transform: scale(1.2);
                    z-index:9;
    }
    100% { opacity: 0 }
}

@-webkit-keyframes anime {
    0% {
        opacity: 0;
    }
    8% {
        opacity: 1;
    }
    17% {
        opacity: 1;
    }
    25% {
        opacity: 0;
         -webkit-transform: scale(1.2);
            z-index:9;
    }
    100% { opacity: 0 }
}
*/

.news{
		display:grid;
		place-items: center;
		position:relative;
		top:0;
		z-index:100;
		margin: 0 auto;
		padding:0;
		text-align:left;
		width:100%;
		height:auto;
		max-width:1000px;
		min-width:200px;
		font-size:clamp(13px , 2vw , 17px);
/*		outline:orange solid 10px*/
}

	.news dl{
		margin:0 1em;
		padding:0;
		width:80%;
}
	.news dt{

		margin-bottom:0.3em;
		margin:0 auto;
/*		opacity: 1;*/
		border-bottom:gray solid 1px;

/*
		mix-blend-mode:difference;
		mix-blend-mode:multiply;
		mix-blend-mode:screen;
		mix-blend-mode:overlay;
		mix-blend-mode:darken;
		mix-blend-mode:lighten;
		mix-blend-mode:color-dodge;
		mix-blend-mode:color-burn;
		mix-blend-mode:hard-light;
		mix-blend-mode:soft-light;
		mix-blend-mode:difference;
		mix-blend-mode:exclusion;
		mix-blend-mode:hue;
		mix-blend-mode:saturation;
		mix-blend-mode:color;
		mix-blend-mode:luminosity;
*/
}




.second_column_home{
	position:relative;
	top:-100px;
	height:auto;
/*	border:green solid 1px */
}

/* banner */
	.banner{
		z-index:800;
		position:relative;
		height:auto;
		margin:2vw auto;
		padding:0;
		display:flex;
		flex-direction:row;
		justify-content:space-around;
		width:clamp(280px , 80vw , 900px);
		width:90vw;
		display:flex;
		flex-wrap:wrap; 
		align-items:space-between;
		gap: clamp(10px , 2vw , 30px);
/*		border:red solid 1px */
	}


	.banner div{
		min-width:12em;
/*		width:clamp(250px , 20vw , 600px);*/
		display: grid;
		place-items: center;
		heigh:auto;
		border-radius:20px;
		background:white;
		padding:0 1em;
		padding-top:0;
		line-height:1.3em;
		inline-size: max-content;
		margin:0 auto;
		margin-inline:auto;
		font-size:clamp(13px , 1.5vw , 16px);
		box-shadow:5px 5px 2px 1px rgba(100, 100, 100, .1);
		align-items:center;
	}

	.banner h4{
/*		flex-direction:row;
		align-items: flex-start;
*/
display: grid;
		justify-items:center;
		position:relative;
		width:clamp(50px , 9em , 200px);
		border-radius:1em;
		text-align:center;
		padding:0 1em;
		line-height:2em;
		margin:1em auto;
		height:2em;
		color:white;
		box-shadow: 2px 2px 2px 1px rgba(10, 10, 10, .2);
}

	.banner a{
	text-decoration: none;
}

	.banner .rankaku h4{border-color:var(--group_border); background-color:#0097a7 !important;color:white}
<!--	.banner .link h4{border-color:var(--group_border); background-color:green !important;color:white}-->
	.banner .column h4{border-color:var(--group_border); background-color:#8d6e63
 !important;color:white}
	.banner .recepi h4{border-color:var(--group_border); background-color:#f50057 !important;color:white}
/*	.banner .recruitment h4{border-color:var(--group_border); background:var(--group05);color:var(--group01)}*/

	.hide_banner{
		visibility:hidden;
		height:0;
		width:0
}



img.suiiki{width:90%;

}

img.ImgR_ukiuo{
	width:70%;
	max-width:500px
	}

	.banner div ul{
		position:relative;
		margin-top:-0.7em;
		align-content:flex-start;
		list-style-type:none;
		padding:0 2em 0 1em;
/*		width:11em;*/
}

	.banner div li{
			display:block;
			text-align:left;
			background:white;
			margin:0.5em;
			border-radius:10px;
			width:fit-content;
}

	.banner div li a{
			display:block;
			text-align:left;
			background:white;
			padding:0.05em 0.4em;
			border-radius:10px;
			width:fit-content;
}

/*
.banner .recruitment{
			background:url(../img/banner_o.png) no-repeat center white !important;
			background-size:contain !important;
	}
.banner .recruitment li{
	border:solid 1px var(--group05)

	}
.banner .recruitment li a{
		background:var(--group05);
		color:var(--group01) !important
}
.banner .recruitment li a:hover{
		background:white;
		color:var(--group05);
}

.banner .ajisabaiwashi{
		background:url(../img/banner_ajisabaiwashi.jpg) no-repeat center 50% white !important;
		background-size:cover !important;
	}
*/


.banner .rankaku{
		background:url(https://mytbasicservice.sakura.ne.jp/testsite/zenmaki/renewal/img/banner_rankaku.png) no-repeat center clamp(60px , 4em , 100px) white !important;
		background-size:contain !important;
	}

.banner .link{
		background:url(https://mytbasicservice.sakura.ne.jp/testsite/zenmaki/renewal/img/banner_link.png) no-repeat center clamp(60px , 4em , 100px) white !important;
		background-size:contain !important;
	}

.banner .column{
		background:url(https://mytbasicservice.sakura.ne.jp/testsite/zenmaki/renewal/img/banner_column.png) no-repeat center 70% white !important;
		background-size:contain !important;
	}

.banner .recepi{
		background:url(https://mytbasicservice.sakura.ne.jp/testsite/zenmaki/renewal/img/banner_recepi.png) no-repeat center 70% white !important;
		background-size:contain !important;
	}
/*
	.recruit{
		display:block;
		background:url(../img/banner_recruit.png) no-repeat center ;
		background-size:contain !important;
		flex-glow:0 !important;
	}

*/


/* 当協会について */

	.transition{
		width:100%;
		overflow-x:auto;
}
	.transition table.tb01{
  border-collapse: collapse;
  width: 50%;
}
@media screen and (-webkit-min-device-pixel-ratio: 0)
	.transition{
		width:100%;
		overflow-x:scroll;
}
	.transition table.tb01{
  border-collapse: collapse;
  width: 50%;
}

	.transition td{background:white}

.tb01 th,
.tb01 td{
  padding: 10px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
font-size:clamp(8px , 5vw , 15px)
}
.tb01 th {
  background:var(--base_bgcolor);
  color: #fff;
	min-width:5em
}


 table.tb02{
	border-collapse: collapse;
	width: 100%;
}

.tb02 th,
.tb02 td{
  padding: 10px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
background:white;
}

.tb02 th {
  background:var(--base_bgcolor);
  color: #fff;
}


.tb02 tr td:first-of-type{
	background:var(--base_bgcolor);
	color:white
}

.yakushoku table{font-size:clamp(10px , 5vw , 15px)}
.yakushoku table th:nth-child(1){
	min-width:8em
}
.yakushoku table th:nth-child(2){
	min-width:4em
}
.yakushoku table th:nth-child(3){
	min-width:7em}


 table.tb03{
	border-collapse: collapse;
	width: 100%;
	font-size:clamp(10px , 3.5vw , 15px);

}

.tb03 th,
.tb03 td{
  padding: 10px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
background:white;
height:3vw
}

.tb03 th {
	background:var(--base_bgcolor);
	color: #fff;
/*	indent-indent:1em*/
	padding:0 1em;
	text-align:left;
	width:12em;
	overflow-wrap:break-word;
	word-break:keep-all
}

.tb03 td {
	font-size:clamp(8px , 2vw , 13px)
}

table.tb03 td a{
	color:#000
	}

table.tb03 td a:hover{
opacity: 0.3;
}

table.tb03 td a{text-decoration:underline}
table.tb03 td a{text-decoration-color:red}
table.tb03 td a{text-decoration-thickness:2px;}
table.tb03 td a{text-underline-offset: 0.4em;}


table.tb03 td a::before{

/*
    content: "";
    display:inline-block;
    width:clamp(0.9vw , 20px , 1.2vw);
    height: 2vw;

    background: url('/img/icon_pdf.png') no-repeat right 50% /contain;
}
table.tb03 td a:hover::before{
    background: url('/img/icon_pdf_h.png') no-repeat right 50% /contain;
*/
}




/* まきに漁業について */

.member_list{
}
.member_list li{
	padding:0.3em 0 0 5.5em;
	margin-bottom:0.2em;
	line-height:1.1em;
	online:red solid 1px
	width:80vw;
	
}



li.pref{
	text-align:cenetr;
	padding-left:0.5em;
	padding-bottom:0.3em;
	margin-top:2em;
	border-top:1.4px solid var(--base_bgcolor);
	z-index: -1;
}


/*
li.pref::befoer{
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width:30%;
  height: 100%;
	background:var(--base_bgcolor);
  z-index: 100;
}
*/

/*
li.pref span{
	width:calc(100% - 5.5em);
	display:block;
	float:right;
	margin:0 auto;
	text-align:center
}
*/



/* 浮魚資源の特徴 */

img.ImgR_ukiuo , img.ImgR_douto{
	float:right;
	width:80vw;
	height:auto;
}

.inner_youtube{
	display:block;
	text-align:center;
	margin:0 auto;
	width:clamp(300px , 80vw , 700px);
	height:clamp(100px , 50vw , 400px);
}

iframe{
	width:clamp(300px , 80vw , 700px);
	height:clamp(100px , 50vw , 400px);
}



/* 資源情報 */
.data_source{
	width:100%;
	position:relative;
	top:0;
	left:0;
	margin:0;
	padding:0;
	font-size:clamp(9px , 2vw , 16px);
}
.data_source ul{
	margin:0;
	padding:0;
	display:flex;
	justify-content:flex-end;
	flex-wrap:wrap;
}

.data_source li a{
	position:relative;
	top:0;
	text-align:right;
	line-height:3em;
	font-size:clamp(9px , 2vw , 16px);
	color:var(--base_a_color);
	background:var(--nav_bgcolor_a);
	color:var(--base_a_color);
	border-radius:1em;
	font-weight:bold;
	font-size:calc(100% * 0.9);
	padding:0.5em 1em ;
	margin:0 0.5em;
	border:#000 solid 1.5px; !important
}

	.data_source li a:hover{
		background:var(--base_a_color);
		color:white;
	}

/* あじ・さば・いわし　発行パンフレット　浜の食べ方　レシピ */
	.aile{
		color:var(--base_font_color);
	}
	.aile ul{
		display:flex;
		flex-wrap:wrap;
		width:100%;
		margin:0 auto;
		padding:0;
		justify-content:center;


	}
	.aile li{
		padding:clamp(5px , 10vw , 10px);
		padding:5px;
		font-size:clamp(16px , 2vw , 18px);
		line-height:1.2em;
		width:clamp(150px , 19vw , 230px);
		text-align:center;
}
	.aile li a{color: inherit; }
	.aile li a:hover{color:var(--base_font_color) !important;}
	.aile li a div {display:block;}
	.aile li a div {display:block;border-bottom:10px white solid}
	.aile li a:hover div {display:block;border-bottom:10px yellow solid}
	.aile img{
		width:clamp(120px , 12vw , 180px);
		padding-top:0.5em;
}
	.aile img a{display:none !important}
	.aile h5{

		font-weight:bold;
		font-size:clamp(16px , 3vw , 20px);
		font-size:1.3vmin;
		text-align:center;
		margin:1em auto
}	

/*
.main_fish img,
.resource img,
.recepi img,
.column img{max-width:100%}
*/

/* 会員専用 */

ul.listtest {
 display: flex;
 flex-wrap: wrap;
 width:auto;
height:auto;
margin-bottom:1em;
justify-content:center
}

ul.listtest > li {
 width: 33%;
 list-style: none;
 background: lightblue;
 border: 1px solid white;
 box-sizing: border-box;
}



ul.listtest li{
height:auto;
min-height:2.5em;
line-height:1.2em;
padding:0.5em 1em;
border-bottom:1px solid white;
border-left:none;
}

ul.listtest li a{color: inherit !important}

ul.listtest li a::after{
    content: "";
    display:inline-block;
    width: 2vw;
    height: 3vw;
    background: url('../img/icon_pdf.png') no-repeat right bottom /contain;
}

ul.listtest li a:hover::after{
    background: url('../img/icon_pdf_h.png') no-repeat right bottom /contain;
}





/*
ul.listtest li ul li:focus {
  border-bottom: 6px solid red
}


ul.listtest li ul li{
   min-height: 100%;
   overflow: hidden;
}

ul.listtest li ul li:first-child{
}

ul.listtest li:nth-child(2n) ,ul.listtest li:nth-child(3n){
	width:fit-content;

}


ul.listtest li ul li span{
display: inline-block;
}

*/


/*
	.arranged_v{
		color:white;
		margin-bottom:3em;
}

	.arranged_v p{
		color:white;
		text-align:left;
		line-height:1.4em;
		font-size:clamp(14px , 5vw , 16px);
}

	.arranged_v h3{
		color:gray;
		border:3px solid gray;
		padding:1em;
		background:white
}


	.arranged_v h4{
		color:#000;
		margin-top:3em;
		border:3px solid #fff;
		padding:1em;
		letter-spacing:0.1em;
		width:fit-content
}

	.arranged_v h5{
		color:#000;
		border:2px solid #fff;
		padding:1em;
		width:fit-content;
		inset: 0;
		 margin:auto
}
	.arranged_v h6{}

	.arranged_v p{}
	.arranged_v .first{
	}
*/