@charset "utf-8";

/*
-----------------------------------------------------
◆◆全国牛乳流通改善協会　スタイルシート◆◆
-----------------------------------------------------
-----------------------------------------------------
【改訂履歴】
24/03/12：「.ContentWrap table .small」追加
20/03/05：初版作成
-----------------------------------------------------
*/

body  {
	width:100%;
	background:#F0F7FD;
}
.Body {
	position: relative;
	width:980px;
	margin:0 auto;
	background:#fff;
}
.Body:before {
	box-shadow: -15px 0 15px -15px #ccc inset;
	content: " ";
	height: 100%;
	left: -15px;
	position: absolute;
	top: 0;
	width: 15px;
	}
.Body:after {
	box-shadow: 15px 0 15px -15px #ccc inset;
	content: " ";
	height: 100%;
	position: absolute;
	top: 0;
	right: -15px;
	width: 15px;
	}
.Lead {
	margin:30px 60px;
	font-size:18px;
	line-height: 180%;
	text-align: left;
}
.Lead h2 {
	margin-bottom:20px;
	padding-bottom: 5px;
	border-bottom:2px solid #1A86E0;
	text-align: center;
	font-size:22px;
	font-weight: bold;
}
.Lead p {
	font-size:16px;
}
.Lead strong {
	color:#c33;
}
.Lead .Sign {
	line-height: 150%;
	font-size:14px;
	text-align: right;
}
.Lead .Name {
	display: inline-block;
	margin-top: 10px;
	font-size:18px;
	letter-spacing: 35px;
}


.TopIndex {
	margin:20px 20px 60px 20px;
	background:#D9EBFA;
}
.TopIndexTitle {
	position: relative;
	height:70px;
	padding-left:10px;
	background:#1A86E0;
	border-left: 25px solid #006ED8;
	font-size:24px;
	font-weight: bold;
	line-height:70px;
	color:#fff;
	text-align: left;
}
.TopIndexTitle:after {
	content:"";
	display: block;
	position: absolute;
	right:0;
	top:0;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 0 70px 70px;
	border-color: transparent transparent #D9EBFA transparent;
}
.TopMenuWrap {
	width:900px;
	margin:30px auto 0 auto;
	padding-bottom: 20px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap:20px;
}
.TopIndexMenu {
	position: relative;
	height:220px;
	margin-top: 10px;
	padding-bottom: 10px;
	background: #A6D0F3;
}
.TopIndexMenu h3 {
	position: relative;
	height:35px;
	padding-left: 75px;
	background: #1A86E0;
	font-size: 16px;
	font-weight: bold;
	line-height:35px;
	text-align: left;
	color:#fff;
}
.TopIndexMenu h3:before {
	content:"";
	display: block;
	position: absolute;
	z-index:3;
	left:-5px;
	top:-20px;
	width: 70px;
	height: 70px;
}
.TopIndexMenu h3.Gold:before {
	background:url(../img/top_crown_gold.png) no-repeat 0px 0px;
}
.TopIndexMenu h3.Silver:before {
	background:url(../img/top_crown_silver.png) no-repeat 0px 0px;
}
.TopIndexMenu h3 span {
	display: inline-block;
	margin-left:10px;
	font-size: 12px;
	font-weight: normal;
}
.TopIndexMenu h4 {
	position: absolute;
	display: grid;
  	place-items: center;
	left:20px;
	top:60px;
	width: 225px;
	height: 90px;
	padding-inline:10px;
	background:#fff;
	border-radius: 10px;
	font-size: 15px;
	font-weight: bold;
	line-height: 125%;
	color:#c33;
	text-align: left;
}
.TopIndexMenu h4:after {
	content:"";
	display: block;
	position: absolute;
	left:245px;
	top:15px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7.5px 0 7.5px 15px;
	border-color: transparent transparent transparent #fff;
}
.TopIndexMenu h4 .small {
	font-size: 14px;
}
.TopIndexMenu img {
	position: absolute;
	left:280px;
	top:45px;
}
.TopIndexMenu p {
	position: absolute;
	left:20px;
	top:155px;
	width: 245px;
	font-size: 18px;
	line-height: 110%;
	text-align: right;
}
.TopIndexMenu p span {
	display: inline-block;
	margin-top:7px;
	font-size: 14px;
	line-height: 110%;
}
.TopIndexMenu a {
	display: block;
	position: absolute;
	z-index:2;
	left:0px;
	top:35px;
	width: 440px;
	height:200px;
	text-indent:-999em;
}
.TopIndexMenu a:hover {
	background: #fff;
	filter:alpha(opacity=20);
	opacity: 0.2;
	cursor: pointer;
}
.TopMovieWrap {
	width:920px;
	margin:20px auto 0px auto;
	padding-bottom: 10px;
}
.TopMovieWrap ul {
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}
.TopMovieWrap ul li {
	width:210px;
	height:200px;
	margin:0px 10px 20px 10px;
	font-size: 12px;
	line-height: 125%;
}
.TopMovieWrap a {
	color:#444;
}
.TopMovieWrap a:link {
	text-decoration: none;
}
.TopMovieWrap a:hover {
	text-decoration: none;
}
.TopMovieWrap a span {
	display: block;
	margin-bottom: 5px;
	padding:5px;
	background: #1A86E0;
	font-weight: bold;
	color:#fff;
}
.TopMovieWrap a:hover span {
	background: #49AEE9;
}
.TopMovieWrap .Thum {
	display: inline-block;
	width:210px;
	height:118px;
	margin-bottom: 5px;
	background: #fff;
	position: relative;
}
.TopMovieWrap .Thum:hover:before {
	content:"";
	display: block;
	width:210px;
	height:118px;
	background:url(../img/top_movie_play.png) no-repeat 0px 0px;
	position: absolute;
	z-index:99;
}
.TopMovieWrap .Thum:hover img {
	filter:alpha(opacity=50);
	opacity: 0.5;
}
.TopIndex2 {
	background: #fff;
}
.TopIndex2 .TopIndexTitle {
	background:#49AEE9;
	border-left: 25px solid #1792D8;
}
.TopIndex2 .TopIndexTitle:after {
	border-color: transparent transparent #fff transparent;
}
.TopTextMenu h3 {
	margin:30px 0px;
	padding-bottom: 5px;
	border-bottom: 3px solid #49AEE9;
	font-size: 20px;
	font-weight: bold;
	text-align: left;
}
.TopTextMenu h3:before {
	content:"■";
	display: inline-block;
	font-size: 24px;
	color: #49AEE9;
}
.TopTextMenu ul   {
	margin:0px 40px;
}
.TopTextMenu ul li a  {
	position: relative;
	display: block;
	padding:10px 0px 10px 30px;
	border-bottom: 1px solid #ccc;
	color:#444;
	text-align: left;
}
.TopTextMenu ul li a:hover  {
	background: #F0F7FD;
	text-decoration: none;
}
.TopTextMenu ul li a:before  {
	position: absolute;
	left: 0;
	top:10px;
	content:"";
	display: inline-block;
	width: 20px;
	height: 20px;
	background:url(../img/top_menu_arrow.png) no-repeat 0px 0px;
}
.TopIndex3 {
	background: #fff;
}
.TopSubBlock {
	width: 460px;
	/*height:275px;*/
	height:325px;
}
.TopSubBlock h2 {
	height:60px;
	padding-left: 10px;
	line-height: 60px;
	font-size: 23px;
	font-weight: bold;
	text-align: left;
	color:#fff;
}
.Sub1 {
	background: #BFE7CF;

	float: left;
}
.Sub1 h2 {
	background: #00A041;
	border-left: 25px solid #008741;
}
.Sub2 {
	background: #D4ECCA;
	float: right;
}
.Sub2 h2 {
	background: #55B42D;
	border-left: 25px solid #45A52D;
}
.TopSubBlock ul {
	margin:30px;
}
.TopSubBlock ul li a {
	display: block;
	height: 50px;
	padding-left: 50px;
	background:url(../img/icon_pdf.png) no-repeat 5px 5px;
	border-bottom: 1px solid #fff;
	color:#444;
	font-size: 17px;
	line-height: 50px;
	text-decoration: none;
	text-align: left;
}
.Sub1 ul li a:hover {
	background:url(../img/icon_pdf.png) no-repeat 5px 5px, #E7F6ED;
}
.Sub2 ul li a:hover {
	background:url(../img/icon_pdf.png) no-repeat 5px 5px, #EAF6E5;
}
footer {
	width: 940px;
	margin:30px auto 0px auto;
	padding: 30px 0px;
	border-top: 2px solid #ccc;
	font-size: 12px;
	text-align: center;
}

/*+++++++++++For Contents+++++++++++*/

.Content header {
	position: relative;
	height:47px;
	border-bottom: 3px solid #006ED8;
}
.HeadTitle a {
	position: absolute;
	display: block;
	left:20px;
	top:15px;
	width: 254px;
	height: 17px;
	text-indent: -999em;
	background:url(../img/content_head_title.png) no-repeat 0px 0px;
}
.HeadCredit {
	position: absolute;
	right:20px;
	top:15px;
	font-size: 14px;
	text-align: right;
}
.ContentHead {
	padding: 0px 40px 30px 40px;
	background: linear-gradient(to bottom,  #D9EBFA 0%,#ffffff 30%,#ffffff 60%,#ffffff 100%);
}
.C_HeadCrown {
	width: 100px;
	height: 115px;
	margin-right: 15px;
	background-color: #006ED8;
	border-radius: 0px 0px 5px 5px;
	text-indent: -999em;
	float:left;
}
.Crown1 {
	background-image:url(../img/content_crown1.png);
}
.Crown2 {
	background-image:url(../img/content_crown2.png);
}
.C_HeadTitle {
	padding-top:0px;
	text-align: left;
	font-size: 32px;
	font-weight: bold;
	line-height: 110%;
	color:#000;
}
.C_HeadPrise {
	display: block;
	margin-bottom: 10px;
	padding:10px;
	background: #338be0;
	border-radius: 0px 0px 10px 0px;
	font-size: 14px;
	font-weight: normal;
	line-height: 100%;
	color:#fff;
}
.HeadMovieBlock {
	position: relative;
	height:338px;
	margin: 20px 0px 30px 0px;
}
.HeadMovieBlock iframe,
.HeadMovieBlock .MovieThum {
	position: absolute;
	left:0;
	top:0;
}
.HeadMovieBlock .ChiefPhoto {
	position: absolute;
	right:0;
	top:0;
}
.HeadMovieBlock .ChiefName {
	width:300px;
	padding-top:5px;
	position: absolute;
	right:0;
	bottom:0;
	background:#fff;
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	line-height: 110%;
}
.HeadMovieBlock .ChiefName span {
	display: inline-block;
	margin:0px 5px;
	font-size: 16px;
}
.HeadMovieBlock .ChiefName span.Photo {
	margin:0px 0px;
	font-weight: normal;
}

.HeadPhoto {
	width:900px;
	height:210px;
}
.HeadPhoto li {
	width:300px;
	text-align: left;
	float: left;
}
.HeadPhoto li:nth-child(2) { text-align: center; }
.HeadPhoto li:nth-child(3) { text-align: right; }

.ContentMenu {
	padding:30px 20px;
	border-top: 3px solid #006ED8;
	border-bottom: 3px solid #006ED8;
	background: #f2f8fd;
}
.Point {
	position: relative;
 width:940px;
 height:160px;
 margin-top:34px;
 border:3px solid #00a041;
 border-radius: 10px;
 background:#fffeee ;
}
.Point h2 {
	position: absolute;
	left:-3px;
	top:-34px;
	width:237px;
	height:194px;
	background:url(../img/content_point.png) no-repeat 0px 0px;
	text-indent: -999em;
}
.Point ol {
	position: absolute;
	left:260px;
	top:30px;
	text-align: left;
}
.Point ol li {
	margin-bottom:10px;
	font-size: 18px;
	font-weight: bold;
	color:#c33;
}
.MenuBlock {
	width:940px;
	margin-top:30px;
	border:2px solid #1a86e0;
	border-radius: 5px;
	background: #fff;
}
.MenuBlock h2 a{
	position: relative;
	display: block;
	height:50px;
	border-radius: 3px 3px 0px 0px;
	background: #1a86e0;
	font-size: 24px;
	font-weight: bold;
	line-height:50px;
	text-align: left;
	text-indent:40px;
	color: #fff;
}
.MenuBlock h2 a:before {
	position: absolute;
	left:20px;
	top:17px;
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 0 6px 10.4px;
	border-color: transparent transparent transparent #fff;
}
.MenuBlock h2 a:hover {
	text-decoration: none;
	background: #49aee9;
}
.MenuBlock ul {
	margin:25px 25px 10px 25px;
	text-align: left;
}
.MenuBlock ul li {
	position: relative;
	display: inline-block;
	margin: 0px 35px 15px 0px;
	white-space: nowrap;
	text-indent:15px;
}
.MenuBlock ul li:before {
	position: absolute;
	left:0px;
	top:5px;
	content: "";
	display: block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 5px 0 5px 8.7px;
	border-color: transparent transparent transparent #1a86e0;
}
.MenuBlock ul li a {
	color:#444;
}
.MenuBlock ul li a:hover {
	text-decoration: underline;
}

/*+++++++++++++Content++++++++++++++*/

.Backtop a {
	display: inline-block;
	padding:0px 20px;
	border-left:1px solid #ccc;
	border-right:1px solid #ccc;
}

.F_Left {
	float: left;
}
.F_Center {
	margin:0 10px;
}
.F_Right {
	float: right;
}

.PhotoBlock {
	display: inline-block;
	margin:30px auto 0px auto;
}
.PhotoBlock img {
	display: inline-block;
	margin:0 10px;
}
.Photo {
	display: inline-block;
	margin:0 10px 20px 10px;
	vertical-align: top;
}
.Photo img {
	margin:0 10px 0 10px;
}
.Photo .PhotoTandem {
	display: block;
	margin-bottom: 10px;
}
.PhotoBlock .Photo img {
	margin:0 0 0 0;
}

.Photo.F_Left {
	margin-right: 20px;
}
.Photo.F_Right {
	margin-left: 20px;
}
.ImgCaption {
	font-size: 12px;
	color:#666;
}
.Clear {
	clear: both !important;
}
.ImgBorder {
	border:1px solid #ccc;
}

section {
	margin-bottom:60px;
}

.ContentWrap {
	margin:30px 20px;
}
.ContentWrap h2,
.ContentWrap h3,
.ContentWrap h4,
.ContentWrap h5,
.ContentWrap h6,
.ContentWrap p,
.ContentWrap li  {
	text-align: left;
}
.ContentWrap h4,
.ContentWrap h5,
.ContentWrap h6,
.ContentWrap p,
.ContentWrap ul,
.ContentWrap ol  {
	margin-bottom:15px;
}
.ContentWrap h2 {
	height: 60px;
	margin-bottom:25px;
	padding-left: 30px;
	background: #49aee9;
	border-radius: 30px;
	font-size: 24px;
	font-weight: bold;
	line-height: 60px;
	color:#fff;
}
.ContentWrap h3 {
	margin:20px 30px 20px 30px;
	padding-bottom: 5px;
	font-size: 20px;
	font-weight: bold;
	border-bottom: 2px solid #49aee9;
	clear: both;
}
.ContentWrap h4 {
	margin-top: 25px;
	padding:10px;
	background: #f5f5f5;
	border-radius: 5px;
	font-size: 18px;
	font-weight: bold;
	clear:both;
}
.ContentWrap h5 {
	position: relative;
	padding:5px 0px;
	border-bottom: 1px dotted #ccc;
	font-weight: bold;
	text-indent: 25px;
	clear:both;
}
.ContentWrap h5:before {
	display: inline-block;
	position: absolute;
	left:0;
	top:6px;
	content: "";
	width:18px;
	height:18px;
	background: #ddd;
	border-radius: 2px;
}
.ContentWrap h6 {
	font-weight: bold;
}
.TextBlock {
	margin:20px 50px;
}
.HalfBlock {
	width: 400px;
}

.ContentWrap p,
.ContentWrap li {
	font-size: 16px;
	line-height: 180%;
}
.ContentWrap p.Note {
	font-size: 14px;
}
.ContentWrap li {
	margin-bottom:10px;
}
.ContentWrap li h6 {
	margin:15px 0px 0px 0px;
}
.ContentWrap li:last-child {
	margin-bottom:0;
}
.ContentWrap ol li {
	list-style: decimal;
	margin-left: 25px;
}
.ContentWrap ol.Maru li {
	list-style: none;
	text-indent: -1em;
}
.ContentWrap ol.Maru li:nth-child(1):before { content:"①"; }
.ContentWrap ol.Maru li:nth-child(2):before { content:"②"; }
.ContentWrap ol.Maru li:nth-child(3):before { content:"③"; }
.ContentWrap ol.Maru li:nth-child(4):before { content:"④"; }
.ContentWrap ol.Maru li:nth-child(5):before { content:"⑤"; }

.ContentWrap ol.Kana li {
	list-style-type: katakana;
	margin-left: 50px;
}

.ContentWrap ul li {
	position: relative;
	padding-left: 15px;
}
.ContentWrap ul li:before {
	position: absolute;
	left:0;
	top:8px;
	content:"";
	display: block;
	width:12px;
	height:12px;
	border-radius: 8px;
	background: #ddd;
}
.ContentWrap table {
	margin: 20px auto;
	border:2px solid #49aee9;
}
.ContentWrap table.Fixed {
	table-layout: fixed;
}
.ContentWrap table.FullTable {
	width: 840px;
}
.ContentWrap table.HalfTable {
	width: 400px;
	margin:20px 0 20px  0 !important;
}
.ContentWrap table caption {
	margin-bottom: 5px;
	font-size: 16px;
	font-weight: bold;
}
.ContentWrap table th,
.ContentWrap table td {
	padding:10px;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
	font-size: 16px;
	text-align: center;
}
.ContentWrap table th {
	background: #eaf6fc;
}
.ContentWrap table .small {
	font-size:10px;
}
.ContentWrap .Idea {
	display: table;
}
.ContentWrap .Idea dt,
.ContentWrap .Idea dd {
	display: table-cell;
}
.ContentWrap .Idea dd {
	padding-left:1em;
}
.ContentWrap .History  {
	margin:15px;
}
.ContentWrap .History dl {
	margin-bottom:5px;
}
.ContentWrap .History dt {
	text-align: center;
	vertical-align: middle;
	width:8em;
	padding:5px;
	background: #f5f5f5;
	border-radius: 3px;
}
.ContentWrap .History dd {
	padding:5px 5px 5px 10px;
	text-align: left;
}

.ContentWrap .DefinitionList {
	margin-bottom:15px;
	line-height: 180%;
	text-align: left;
}
.ContentWrap .DefinitionList dt {
	position: relative;
	padding-left: 15px;
	font-weight: bold;
}
.ContentWrap .DefinitionList dt:before {
	position: absolute;
	left:0;
	top:8px;
	content:"";
	display: block;
	width:12px;
	height:12px;
	border-radius: 8px;
	background: #ddd;
}
.ContentWrap .DefinitionList dd {
	padding-left: 15px;
}
.ContentWrap .DefinitionList dd li {
	margin-bottom: 0;
}
.ContentWrap strong {
	font-weight: bold;
}

/*+++++++++++++PageTop+++++++++++++*/

#pageTop{
	width:60px;
	height:60px;
	position:fixed;
	bottom:20px;
	right:25px;
	text-indent:-999em;
	background-image:url("../img/bt_pagetop.png");
	background-size:120px 60px;
	}

#pageTop:hover{
	background-position:-60px 0px;
	}