@charset "utf-8";

@media screen and (max-width : 640px) {
/* ==================================================
heading
================================================== */
.box_heading {
    padding-left: 10px;
    letter-spacing: 1px;
    margin-bottom: 38px;
}
.box_heading h2 {
    font-size: 143.75%;
}
.box_heading .box_heading_en {
    font-size: 78.2%;
}
.show_pc {
    display: none;
}
.show_sp {
    display: block;
}
/* mainvs
================================================== */ 
.mainvs_caption {
    margin: 18px 0 5px;
    position: relative;
    left: 0;
    top: auto;
    z-index: 1;
}
.mainvs_caption .main_caption_inner {
    min-height: auto;
    font-size: 106.25%;
    padding: 15px 15px 0;
    z-index: 1;
    min-width: auto;
    max-width: 100%;
    max-height: 100%;
}
#tmp_mainvs_movie.show_slide .mainvs_caption {
    top: 0;
    left: 0;
    max-width: 100%;
    margin-top: 0;
}
#tmp_mainvs_movie.show_slide .mainvs_caption .main_caption_inner {
    padding: 14px 19px 32px;
    min-width: calc((100% - 40px));
    min-height: 100px;
    max-height: 100%;
    border-radius: 0 10px 10px 0;
}
#tmp_mainvs_movie .mainvs_movie_inner {
    position: relative;
    padding: 3px 0 5px;
    overflow: visible;
}
/* youtube api */
#tmp_youtube_api {
    min-height: auto;
    border-radius: 0;
}
#tmp_youtube_api .youtube_api_wrap iframe {
    border-radius: 0;
}
#tmp_youtube_api .youtube_api_wrap {
    width: 100%;
    height: auto;
}
.mainvs_control {
    right: 0;
    left: 0;
    bottom: -15px;
    min-width: auto;
    font-size: 87.5%;
    margin: 0 10px;
    border-width: 1px;
    padding: 8px 10px 6px 17px;
    min-height: auto;
    border-radius: 50px;
    box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -webkit-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -moz-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
}
.mainvs_control_inner {
    gap: 0;
    justify-content: center;
}
#tmp_mainvs_movie.show_video .mainvs_control_inner {
    gap: 5px 12px;
    justify-content: center;
}
.mainvs_control_movie {
    gap: 0 10px;
}
.mainvs_control_movie li {
   min-height: 27px;
}
.mainvs_control_movie #tmp_pause_button:before,
.mainvs_control_movie #tmp_pause_button:after {
    width: 3px;
    height: 10px;
    margin-top: 0.5px;
}
.mainvs_control_movie #tmp_pause_button:after {
    left: 6px;
}
.mainvs_control_movie #tmp_play_button:before {
    width: 3px;
    height: 10px;
    margin-top: 0.5px;
    border-width: 6px 0 6px 8px;
}
.mainvs_control_movie .control_play a {
    min-width: 25px
}
.mainvs_control_movie .control_mute a {
    min-width: 24px;
}
.mainvs_control_movie #tmp_unmute_button {
    background-position: 0 7px;
    background-size: 16px auto;
}
.mainvs_control_movie #tmp_mute_button {
    background-position: 0 7px;
    background-size: 15px auto;
}
.mainvs_control_movie .control_subtitle a {
    padding-left: 20px;
    background-position: 0 6px;
    background-size: 16px auto;
    position: relative;
    top: 4px;
}
/* control splide */
#tmp_mainvs_movie .mainvs_movie_inner .splide__toggle:before,
#tmp_mainvs_movie .mainvs_movie_inner .splide__toggle:after {
	width: 3px;
	height: 10px;
    margin-top: 2px;
}
#tmp_mainvs_movie .mainvs_movie_inner .splide__toggle:after {
	left: 6px;
}
#tmp_mainvs_movie .mainvs_movie_inner .splide__toggle:not(.is-active):before {
	border-width: 6px 0 6px 8px;
}
#tmp_mainvs_movie .mainvs_movie_inner .splide__toggle {
    min-width: 65px;
    padding-left: 14px;
}
#tmp_mainvs_movie #tmp_play_button{
    display: inline-block;
}
#tmp_mainvs_movie #tmp_pause_button{
    display: none;
}
#tmp_gallery_banner img {
    height: 397px;
    object-fit: cover;
    border-radius: 0;
}
/* mainvs */
.sec_mainvs {
    margin-top: -27px;
}
#tmp_mainvs {
    padding-bottom: 61px;
    margin-bottom: 10px;
}
#tmp_mainvs .splide__slide {
    width: 100%;
    padding: 0;
}
#tmp_mainvs .mainvs_item img {
    border-radius: 10px;
    height: 397px;
    object-fit: cover;
}
#tmp_mainvs .splide__slide.is-active:not(.splide__slide--clone) {
    width: 100%;
}
#tmp_mainvs .splide__arrow--prev {
    left: -15px;
}
#tmp_mainvs .splide__arrow--next {
    right: -15px;
}
#tmp_mainvs_movie.show_slide {
    padding: 3px 0;
}
#tmp_mainvs.no-splide .splide__slide {
    width: 100%;
}
/* edit
================================================== */ 
.sec_edit {
    padding: 10px 0 34px;
}
/* news
================================================== */
.sec_news {
    padding: 52px 0 30px;
}
.box_news {
    display: block;
}
.sec_news .box_news {
    padding-right: 0;
}
.sec_news .box_heading {
    margin-bottom: 32px;
}
.box_news .news_heading {
    width: 100%;
    padding-right: 140px;
    min-height: auto;
}
.box_news .list_news li {
    padding: 13px 0;
}
.box_news .list_news .new_date {
    width: 100%;
    display: block;
    padding: 6px 0 0;
    margin-bottom: 2px;
}
.box_news .list_news .new_item {
    display: block;
    font-size: 112.5%;
}
.box_news .list_news .new_link {
    display: block;
}
.box_news .list_news .new_link a {
    padding-left: 14px;
    background-position: 0 12px;
    background-size: 8px auto;
}
.box_news .no_data {
    font-size: 112.5%;
}
.news_link_info {
    margin-top: 14px;
    text-align: right;
}
.news_link_info a {
    padding-left: 15px;
    font-size: 112.5%;
    background-size: 8px auto;
    background-position: 0 12px;
}
.box_news .bg_change {
	position: absolute;
	right: 19px;
	bottom: auto;
	top: -45px;
}
.box_news .bg_change img{
	width: 108px;
	height: auto;
}
/* menu
================================================== */
.sec_menu {
    padding: 46px 0 55px;
}
.sec_menu .box_heading{
   margin-bottom: 30px;
}
.sec_menu .box_heading .subttl_desc {
    text-align: left;
}
.sec_menu .menu_list {
    gap: 20px 10px;
}
.sec_menu .menu_list li {
    width: calc((100% - 10px) / 2);
}
.menu_item{
    border-radius: 5px;
    box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -webkit-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -moz-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
}
.menu_item .menu_link {
    padding: 16px 8px 12px 25px;
    font-size: 87.5%;
    background-position: 10px 19px;
}
.submenu_splide {
    margin-bottom: 32px;
}
#tmp_submenu_splide .splide__slide {
    padding: 15px 0;
    width: 200px;
}
#tmp_submenu_splide .splide__slide.is-active:not(.splide__slide--clone){
    width: 250px;
}
#tmp_submenu_splide.splide_common .splide__arrow--prev {
    left: calc((100% - 320px) / 2);
} 
#tmp_submenu_splide.splide_common .splide__arrow--next {
    right: calc((100% - 320px) / 2);
}
#tmp_submenu_splide .menu_item a {
    border-radius: 10px;
}
#tmp_submenu_splide .menu_item .menu_link {
    padding: 5px 8px 5px 28px;
    background-position: 14px 11px;
}
#tmp_submenu_splide .splide__slide.is-active:not(.splide__slide--clone) .menu_link {
    padding: 9px 8px 7px 28px;
    background-position: 14px 14px;
}
#tmp_submenu_splide.no-splide .splide__list {
    display: block;
}
#tmp_submenu_splide.no-splide .splide__list .splide__slide {
    width: auto;
}
#tmp_submenu_splide .menu_item .menu_link {
    max-height: 80px;
}
#tmp_submenu_splide .menu_item .menu_image img {
    border-radius: 5px 5px 6px 6px;
}
/* sec_menu2
================================================== */
.sec_menu2 {
    padding: 17px 0 60px;
}
.sec_menu2 .box_heading .subttl_desc {
    text-align: left;
}
.sec_menu2 .menu_cnt img {
    width: 100%;
    height: auto;
}
.sec_menu3 {
    padding: 60px 0 60px;
}
.sec_menu3 .box_heading .subttl_desc {
    text-align: left;
}
.sec_menu3 .menu_list2 {
    gap: 20px;
}
.sec_menu3 .menu_list2 li {
    width: 100%;
}
.sec_menu3 .menu_list2 li .menu_item .menu_image {
    width: 52%;
    padding: 18px 50px;
}
.sec_menu3 .menu_list2 li .menu_item .menu_link {
    background-position: left 10px center;
    font-weight: bold;
}
/* movie
================================================== */
.sec_movie {
    padding: 17px 0 22px;
}
.box_movie {
    display: block;
    margin: 0;
    gap: 0;
    padding: 38px 18px;
}
.box_movie .show_pc {
    display: none
}
.box_movie .show_sp {
    display: block
}
.box_movie .movie_cnt {
    margin-bottom: 23px;
}
.box_movie .box_heading {
    margin-bottom: 28px;
}
.box_movie .movie_desc {
    font-size: 112.5%;
    line-height: 1.4;
}
.box_movie .movie_iframe {
    width: 100%;
}
.box_movie .movie_link {
    margin-top: 30px;
}
.box_movie .movie_link a {
    padding: 12px 42px 7px 20px;
    font-size: 112.5%;
    box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -webkit-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -moz-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
}
.box_movie .movie_link a:after {
    right: 19px
}
/* area
================================================== */
.sec_area {
    padding: 49px 0;
}
.sec_area .box_heading {
    letter-spacing: 1.5px;
    margin-bottom: 33px;
}
.sec_area .box_news .news_heading {
    width: 100%;
}
.sec_area .box_news .list_news li {
    padding: 14px 0 10px;
}
.sec_area .box_news .list_news li:first-child {
    padding-top: 0;
}
/* related_link
================================================== */
.sec_related_links {
    padding: 49px 0 32px;
    margin-bottom: 28px;
}
.sec_related_links .box_heading {
    margin-bottom: 32px;
}
.related_link_inner {
    gap: 0;
    display: block;
}
.related_link_inner .bg_change {
	display: block;
	text-align: center;
	position:static;
}
.related_link_inner .bg_change img {
	width: 130px;
	height: auto;
}
.related_link_inner .related_link_heading {
    width: 100%;
    min-height: auto;
    padding: 0;
    background: transparent;
}
.related_link_list {
    display: block;
}
.related_link_list li {
    width: 100%;
    margin-bottom: 16px;
}
.related_link_list li a {
    font-size: 112.5%;
    padding: 12px 42px 10px 19px;
    color: #333333;
    box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -webkit-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
    -moz-box-shadow: 0 2px 3px 0 rgba(34, 34, 34, 0.15);
}
.related_link_list li a:after {
    right: 19px;
}
/* ==================================================
編集エリア　見出し１～６
================================================== */
#tmp_contents h1{
    font-size: 150%;
    background-image: url(/shared/templates/foodloss_free/images/h1_bg_sp.jpg);
    background-size: 100% 40px;
    -webkit-background-size: 100% 40px;
    -moz-background-size: 100% 40px;
    padding: 18px 9px 0;
    margin-bottom: 0.4em;
}
#tmp_contents h2{
    font-size: 137.5%;
    background: #ffffff url(/shared/templates/foodloss_free/images/h2_bg_sp.png) no-repeat left 9px;
    background-size: 3px auto;
    -webkit-background-size: 3px auto;
    -moz-background-size: 3px auto;
    margin: 1.2em 0 1.2em;
    padding: 4px 10px 0 13px;
}
#tmp_contents h3{
    font-size: 137.5%;
    line-height: 1.5;
    background-image: url(/shared/templates/foodloss_free/images/h3_bg_sp.jpg);
    background-position: left 25px;
    background-size: 18px auto;
    -webkit-background-size: 18px auto;
    -moz-background-size: 18px auto;
    padding: 11px 10px 13px 24px;
    margin-bottom: 0.9em;
}
#tmp_contents h4{
    font-size: 118.7%;
    line-height: 1.7;
    margin: 0 0 0.7em;
    padding: 0 0 4px 0;
}
#tmp_contents h5{
    font-size: 112.5%;
    line-height: 1.7;
    margin: 1.4em 0 0.3em;
    padding-left: 15px;
    background-position: 1px 6px;
}
#tmp_contents h6{
    line-height: 1.7;
    margin: 0.8em 0 0.1em;
}
#tmp_contents ul{
    margin-bottom: 1.5em;
}
#tmp_contents ul li,
#tmp_contents ol li {
    margin: 0 0 0.7em;
}
#tmp_contents table.datatable,
#tmp_contents table.enquete_table{
    margin: 0.9em 0 0.9em;
}
#tmp_contents table.datatable th,
#tmp_contents table.enquete_table th{
    padding: 19px 18px 20px;
}
#tmp_contents table.datatable td,
#tmp_contents table.enquete_table td {
    padding: 17px 22px 18px;
}
/* accessibility
================================================== */
.color_blue #tmp_submenu_splide .menu_item a,
.color_black #tmp_submenu_splide .menu_item a,
.color_yellow #tmp_submenu_splide .menu_item a {
    border-radius: 0;
}
.fsize_big2 .mainvs_control,
.fsize_big .mainvs_control {
    font-size: 0.875rem;
}
.no_javascript #tmp_submenu_splide .splide__list {
    display: block;
}
.no_javascript #tmp_submenu_splide .splide__slide {
    width: 100%;
    margin-bottom: 15px;
}
.no_javascript #tmp_mainvs .splide__list {
    max-height: 420px;
}
.fsize_big .box_news .list_news .new_date {
    width: 100%;
}
.fsize_big2 .box_news .list_news .new_date {
    width: 100%;
}
.fsize_small .function_menu_ttl p{
    padding-top: 3px;
}
.fsize_big2 #tmp_submenu_splide.splide_common .splide__arrow--prev,
.fsize_big #tmp_submenu_splide.splide_common .splide__arrow--prev,
.fsize_small #tmp_submenu_splide.splide_common .splide__arrow--prev {
    left: calc((100% - 320px) / 2);
} 
.fsize_big2 #tmp_submenu_splide.splide_common .splide__arrow--next,
.fsize_big #tmp_submenu_splide.splide_common .splide__arrow--next,
.fsize_small #tmp_submenu_splide.splide_common .splide__arrow--next {
   right: calc((100% - 320px) / 2);
}
.fsize_big2 #tmp_mainvs .splide__arrow--prev,
.fsize_small #tmp_mainvs .splide__arrow--prev {
    left: -15px;
}
.fsize_big2 #tmp_mainvs .splide__arrow--next,
.fsize_small #tmp_mainvs .splide__arrow--next {
    right: -15px;
}
}
