@charset "utf-8";

/* =====================================
   10大ニュース用
===================================== */

/* row */

.row {
    display: grid;
    gap: 30px;
    padding: 0 30px;
    margin: 0px 0 30px 0;
}

.row--1-1 {
    grid-template-columns: 1fr 1fr;
}

.row--2-1 {
    grid-template-columns: 2fr 1fr;
}

.row--1-2 {
    grid-template-columns: 1fr 2fr;
}

.row--1-3 {
    grid-template-columns: 1fr 3fr;
}

.row--1-4 {
    grid-template-columns: 1fr 4fr;
}

.row--1-5 {
    grid-template-columns: 1fr 5fr;
}

.row--1-1-1 {
    grid-template-columns: 1fr 1fr 1fr;
}

.row__col > p,
.row__col > ul,
.row__col > .figure {
    padding: 0;
    margin: 0;
}

.row__col p + ul {
  margin-top: 10px;
}

.row__col .figure {
    text-align: center;
}

.row__col .figure img {
    margin-left: auto;
    margin-right: auto;
}

.row__col p + .figure {
  margin-top: 5px;
}

.row__col .figure + p {
  margin-top: 5px;
}

.row__col .figure p{
    padding: 0;
    margin: 0;
}

.row__col .figure + ul {
  margin-top: 10px;
}

.row__col p + .icon-arrow01 {
  margin-top: 10px;
}

.row__col .figure + .box-border-solid {
  margin-top: 5px;
}

.row__col .box-border-solid + .figure {
  margin-top: 5px;
}

.figure .text-box-border + img {
  margin-top: 5px;
}

.figure img + p.caption {
  margin-top: 5px;
  padding-left: 0px;
  padding-right: 0px;
}

.figure p.caption + img {
  margin-top: 5px;
}

.figure img + .box-border-solid {
  margin-top: 5px;
}

.figure .box-border-solid + img {
  margin-top: 5px;
}

@media screen and (max-width: 768px) {
.row {
    display: block;
    margin: 0px 0 30px 0;
}

.row__col {
	margin-top: 30px;
}

.row__col:first-child {
	margin-top: 0px;
}

.row__col .figure img {
    max-width: 100%;
    margin: auto;
}
}

/* キャプションレイアウト */

.caption-box {
    display: grid;
    gap: 15px;
}

.caption--1-1 {
    grid-template-columns: 1fr 1fr;
}

.caption--2-1 {
    grid-template-columns: 2fr 1fr;
}

.caption--1-2 {
    grid-template-columns: 1fr 2fr;
}

.caption__col p{
    padding: 0;
    margin: 0;
}

.caption__col > p,
.caption__col > ul,
.caption__col > .figure {
    padding: 0;
    margin: 0;
}

.caption__col .figure img {
    width: 100%;
}

@media screen and (max-width: 768px) {
.caption-box {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
}

/* 矢印 */

.icon-arrow01 {
    margin: -5px 0 15px 0;
    text-align: center;
}

ol.ol-arrow {
    padding: 0;
    margin: 0;
    font-size: 1em !important;
}

.ol-arrow li.ol-arrow__li{
    padding: 10px 0 53px 0;
    margin: 0;
	background-image: url("../attach/img/icon-arrow02.png");
	background-repeat: no-repeat;
	background-position: bottom center;
	background-size: 43px;
    list-style: none;
}

.ol-arrow li.ol-arrow__li:first-child{
    padding-top: 0;
}

.ol-arrow li.ol-arrow__li:last-child{
    padding: 10px 0 0px 0;
	background-image: none;
}

ol.ol-arrow p{
    padding: 0;
    margin: 0;
}

ol.ol-arrow .figure{
    padding: 0;
    margin: 0;
}

ol.ol-arrow-number  {
    margin-left: 20px;
}

ol.ol-arrow-number li.ol-arrow__li {
    list-style: decimal;
}

li.ol-arrow__li p + .figure {
  margin-top: 5px;
}

li.ol-arrow__li .figure + p {
  margin-top: 5px;
}

/* ol */

ol.ol-nostyle {
    padding: 0;
    margin: 0;
}

ol.ol-nostyle li{
    margin: 10px 0 0 0;
    padding: 0;
    list-style: none;
}

ol.ol-nostyle li.box-green{
    padding: 5px 5px;
    margin: 10px -8px 10px -8px;
    list-style: none;
    border: solid 3px #54A600;
}

ol.ol-nostyle li:first-child{
    margin-top: 0;
}

/* テキスト */
.text-center{
    text-align: center;
}
.text-left{
    text-align: left;
}
.font-red{
    color: #C00000;
}
.font-orange{
    color: #F57D3E;
}
.font-purple{
    color: #D406C8;
}
.font-green{
    color: #65AB4B;
}
.font-blue{
    color: #3671C0;
}
.text-box-orange{
    display: block;
    background-color: #FAE5D7;
    border: solid 1px #E36F22;
    padding: 5px 10px;
    width: fit-content;   /* 中身のテキスト幅に合わせる */
}
.text-box-yellow{
    display: block;
    background-color: #FDF2CD;
    border: solid 1px #243F58;
    border-radius: 23px;
    padding: 10px 15px;
}
.text-box-border{
    display: block;
    width: fit-content;   /* 中身のテキスト幅に合わせる */
    border: solid 1px #000000;
    padding: 5px 10px;
    margin: auto;
}

@media screen and (max-width: 768px) {
.text-box-orange{
    margin: auto;
}
.text-box-border{
    margin: auto;
}
}

/* テキスト枠線 */
.box-border-dotted {
    position: relative;
    border-radius: 23px;
    padding: 18px 20px 20px 20px;
    border: 2px dotted #EA7E3D;
    text-align: left;
}

.box-border-solid {
    position: relative;
    border-radius: 23px;
    padding: 18px 20px 20px 20px;
    border: 1px solid #757575;
    text-align: left;
}

.box-border-dotted p,
.box-border-solid p{
    padding: 0;
    margin: 0;
}

/* 導入により期待される効果 */

.box-effects-green {
    background-color: #D7EAB5;
}

.box-effects-purple {
    background-color: #D2CFE5;
}

.box-effects h2{
    margin: 0px;
    padding: 8px 18px 6px 18px;
    color: #fff;
}

.box-effects-green h2{
    background-color: #008A1B;
}

.box-effects-purple h2{
    background-color: #483F89;
}

.box-effects p{
    margin: 0px;
    padding: 20px 30px;
    font-weight: 600;
}

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

/* font-size */
p.text-small{
    font-size: 1em !important;
}

/* dl */

dl {
  margin-left: 30px;
  font-size: 1.142857em !important;
}

dl dd {
  margin-left: 15px;
}

dl dd {
  margin-top:5px;
}


dl dd + dt {
  margin-top: 15px;
}

/* link */
a.link-blank{
    background-image: url(https://www.affrc.maff.go.jp/j/shared_new/shared/images/icon_wo2.png);
    background-repeat: no-repeat;
    background-position: right 40%;
    margin: 0 4px 0 0;
    padding: 0 20px 0 0;
}

/* table リスト*/
.table-list01{
    font-size: 1.142857em !important;
}

.table-list01 p + table {
  margin-top: 5px;
}

.table-list01 table{
    border-bottom: solid 2px #7f7f7f;
}

.table-list01 tr.top{
    background-color: #fff;
    border-top: solid 2px #000;
    border-bottom: solid 2px #000;
}

.table-list01 tr.tr-back-color01{
    background-color: #c5ffff;
}

.table-list01 tr.tr-back-color02{
    background-color: #c6ffce;
}

.table-list01 tr.tr-back-color03{
    background-color: #ffffa1;
}

.table-list01 tr.tr-back-color04{
    background-color: #ffccfd;
}

.table-list01 th{
    font-weight: 400;
}

.table-list01 th,
.table-list01 td{
    padding: 0px 10px;
}

.table-list01 th.left,
.table-list01 td.left{
    text-align: left;
}

.table-list01 th.right,
.table-list01 td.right{
    text-align: right;
}