@charset "utf-8";

@media screen and (min-width : 641px) and (max-width: 1240px) {
    #tmp_top_sns .sns_list {
        padding: 0 10px;
    }
}
@media screen and (max-width: 860px) {
    #tmp_top_about .about_img.view_sp {
        display: block;
        position: absolute;
        top: -42px;
        left: -10px;
        right: -10px;
    }
    #tmp_top_about .about_img.view_sp img {
        max-width: 360px;
    }
    #tmp_top_about .about_img.view_pc {
        display: none;
    }
    #tmp_top_about {
        padding: 120px 0 105px;
    }
    #tmp_top_about_ttl,
    #tmp_top_about_cnt {
        padding: 0;
    }
    #tmp_top_about_ttl {
        margin-bottom: 18px;
    }
}

@media screen and (max-width : 640px) {
/* ==================================================
common
================================================== */
#tmp_top_article_ttl h2,
#tmp_top_about_ttl h2,
#tmp_top_fujikonomi_ttl h2,
#tmp_top_movie_ttl h2,
#tmp_top_sns_ttl h2 {
    font-size: 131.25%;
}
/* read_btn
================================================== */
.read_btn {
    margin: 30px auto 40px;
}
.read_btn p {
    min-width: auto;
    font-size: 87.5%;
    display: block;
}
/* ==================================================
greeting
================================================== */
#tmp_wrap_greeting {
    padding-bottom: 176px;
    background-position-x: calc(50% - 100px),calc(50% - 100px),center;
    background-size: 1000px auto,1000px auto,199px;
}
#tmp_wrap_greeting::after {
    bottom: -4px;
    height: 4px;
    background-size: 1000px auto;
}
#tmp_greeting {
    display: block;
}
#tmp_greeting_visual {
    width: auto;
    max-width: none;
    padding: 0 0 58px;
    margin: 0 -10px;
}
#tmp_greeting_introduction {
    width: 100%;
    padding: 0;
}
#tmp_greeting_introduction .catch {
    margin: 0 auto 18px;
    width: 200px;
}
#tmp_greeting_introduction .lead {
    font-size: 81.25%;
    line-height: 1.75;
}
/* greeting_visual_slide
================================================== */
/* pickup_item */
#tmp_greeting_visual_slide .pickup_item {
	-webkit-border-radius:15px;
	-moz-border-radius:15px;
	border-radius:15px;
}
#tmp_greeting_visual_slide .pickup_item .pickup_item_cnt {
    padding:0 10px 15px;
}
#tmp_greeting_visual_slide .pickup_item .pickup_item_cnt .category {
    padding: 7px 11px 3px;
    font-size: 87.5%;
}
#tmp_greeting_visual_slide .pickup_item .pickup_item_cnt .date {
    font-size: 81.25%;
    margin: 10px 0 6px 10px;
}
#tmp_greeting_visual_slide .pickup_item .pickup_item_cnt .title {
    font-size: 100%;
    padding: 0 10px;
}
#tmp_greeting_visual_slide .pickup_item .pickup_item_cnt .tags {
    font-size: 75%;
    padding-left: 10px;
}
#tmp_greeting_visual_slide .splide__controls {
    margin: 18px auto 0;
	background-color: transparent;
    padding:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	border-radius:0;
}
#tmp_greeting_visual_slide .splide_common .splide__progress .progress_current {
    font-size: 162.5%;
}
#tmp_greeting_visual_slide .splide_common .splide__progress .progress_total {
    font-size: 87.5%;
    margin-bottom: 4px !important;
}
#tmp_greeting_visual_slide .splide_common .splide__progress {
    padding: 0 27px 0 24px;
}
/* ==================================================
top_info
================================================== */
#tmp_wrap_top_info {
    padding: 20px 0 13px;
}
#tmp_top_info {
	display: block;
}
#tmp_top_info_ttl {
    width: 100%;
    margin: 0 0 12px;
}
#tmp_top_info_ttl h2 {
    font-size: 100%;
}
#tmp_top_info_cnt ul {
    font-size: 87.5%;
}
#tmp_top_info_cnt ul li {
    background-image: url(/shared/site_kotohajime/images/icon/arrow_icon_sp.png);
    background-size:7px auto;
    padding-left: 13px;
    margin-bottom: 14px;
}
/* ==================================================
top_event
================================================== */
#tmp_top_event_ttl {
    margin: 0 0 18px;
}
#tmp_top_event_ttl::after {
    bottom: auto;
    top: 0;
    right: -18px;
    width: 105px;
    height: 60px;
}
#tmp_top_event_ttl h2 .balloon {
    font-size: 81.25%;
    padding: 4px 17px 3px;
}
#tmp_top_event_ttl h2 .label {
    font-size: 131.25%;
    margin-top: 15px;
}
#tmp_top_event .event_item {
    display: block;
    padding-bottom: 20px;
}
#tmp_top_event .event_item .img {
    float: right;
    max-width: 115px;
    margin: 0 0 5px 5px;
}
#tmp_top_event .event_item .event_item_cnt .meta {
    font-size: 87.5%;
    margin: 0 0 8px;
    padding-top: 0;
}
#tmp_top_event .event_item .event_item_cnt .meta .category {
    font-size: 85.7%;
    padding: 2px 12px;
    margin:0 0 10px;
}
#tmp_top_event .event_item .event_item_cnt .meta .date {
    display: block;
}
#tmp_top_event .event_item .event_item_cnt .title {
    clear: both;
}
#tmp_top_event .container::after {
    left: -33px;
    bottom: -113px;
    width: 146px;
    height: 84px;
}
#tmp_top_event_cnt .note {
    font-size: 81.25%;
}
#tmp_top_event_cnt .read_btn {
    margin: 16px auto 38px;
}
/* ==================================================
top_article
================================================== */
#tmp_top_article {
    padding:78px 0 37px;
}
#tmp_top_article_ttl {
    margin: 0 0 17px;
}
#tmp_top_article_cnt .lead {
    font-size: 87.5%;
    margin: 0 0 27px;
    line-height: 1.8;
}
#tmp_top_article_cnt .lead br {
    display: none;
}
#tmp_top_article_cnt .wrap_article_item {
	display: block;
}
#tmp_top_article_cnt .article_item {
    width: 100%;
    margin: 0 0 20px;
    padding-bottom: 20px;
}
#tmp_top_article_cnt .article_item .article_item_cnt {
    padding: 15px 0 0;
}
#tmp_top_article_cnt .article_item .article_item_cnt .category {
    font-size: 87.5%;
}
#tmp_top_article_cnt .article_item .article_item_cnt .date {
    font-size: 81.25%;
    margin-bottom: 5px;
}
#tmp_top_article_cnt .article_item .article_item_cnt .title img {
    width: 45px;
    height: auto;
    margin-left: 10px;
    vertical-align: middle;
}
#tmp_top_article_cnt .article_item .article_item_cnt .tags li {
    padding: 4px 11px 2px;
}
/* ==================================================
top_about
================================================== */
#tmp_top_about {
    padding: 120px 0 40px;
}
#tmp_top_about_cnt .lead {
    font-size: 87.5%;
    line-height: 1.75;
}
/* ==================================================
top_fujikonomi
================================================== */
#tmp_wrap_top_fujikonomi {
    padding-bottom: 60px;
}
#tmp_wrap_top_fujikonomi::before {
    top: 3px;
    width: 192px;
    height: 174px;
    background-size:192px auto;
}
#tmp_wrap_top_fujikonomi::after {
    bottom: -35px;
    width: 132px;
    height: 80px;
    background-size:132px auto;
}
#tmp_top_fujikonomi {
    padding: 57px 20px 30px;
}
#tmp_top_fujikonomi_ttl {
    margin: 0 auto 18px;
}
#tmp_top_fujikonomi_cnt p {
    font-size: 87.5%;
    line-height: 1.75;
}
#tmp_top_fujikonomi_cnt .plan_list {
    margin: 18px auto 15px;
    font-size: 87.5%;
}
#tmp_top_fujikonomi_cnt .plan_list li {
    padding: 16px 20px;
    line-height: 1.65;
}
#tmp_top_fujikonomi_cnt .read_btn {
    margin: 34px auto 8px;
}
/* ==================================================
top_movie
================================================== */
#tmp_top_movie {
    padding: 60px 0 30px;
}
#tmp_top_movie_ttl {
    margin: 0 auto 34px;
    padding-top: 54px;
    background-image: url(/shared/templates/kotohajime_top/images/movie_ttl_bg_sp.png);
    background-size:49px auto;
}
/* movie_tab
================================================== */
#tmp_movie_tab_menu {
    max-width: none;
}
.used_javascript #tmp_movie_tab_menu {
    padding-top: 4.7em;
}
#tmp_movie_tab_menu .tab_ttl {
    width: 50%;
}
#tmp_movie_tab_menu .tab_ttl p {
    font-size: 81.25%;
}
.used_javascript #tmp_movie_tab_menu #tmp_tab_menu2 .tab_ttl {
    left: 50%;
}
.used_javascript #tmp_movie_tab_menu #tmp_tab_menu3 .tab_ttl {
    right: auto;
    left: 0;
    top: 2.7em;
}
#tmp_movie_tab_menu #tmp_tab_menu3 .tab_ttl p::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 14px;
    width: 1px;
    border-left:1px solid #c6cad0;
}
#tmp_movie_tab_menu .movie_item span.img {
    margin: 0 0 14px;
}
#tmp_movie_tab_menu .movie_item span.caption {
    font-size: 87.5%;
}
#tmp_movie_tab_menu .splide__controls {
    margin-top: 19px;
}
#tmp_movie_tab_menu .splide_common .splide__progress {
    padding: 0 24px 0 18px;
}
#tmp_top_movie_cnt .read_btn {
    margin-top: 30px;
}
/* ==================================================
top_sns
================================================== */
#tmp_top_sns {
    padding: 68px 0 10px;
}
#tmp_top_sns_ttl {
    margin: 0 auto 22px;
    padding-top: 50px;
    background-image: url(/shared/templates/kotohajime_top/images/sns_ttl_bg_sp.png);
    background-size:46px auto;
}
#tmp_top_sns .sns_list {
	display: block;
}
#tmp_top_sns .sns_list .sns_item {
    width: 100%;
    margin-bottom: 14px;
}
#tmp_top_sns .sns_list .sns_item h3 {
    margin: 0 0 13px;
    font-size: 125%;
}
#tmp_top_sns .sns_list .sns_item .sns_iframe {
    padding: 0;
}
#tmp_top_sns .sns_list .sns_item iframe {
    width: 100% !important;
    height: 300px !important;
}
#tmp_greeting_visual_slide .pickup_item.active::after {
    opacity: 0;
}

/* ==================================================
NoJS
================================================== */
.no_javascript #tmp_greeting_visual_slide .splide__list,
#tmp_greeting_visual_slide .splide.no-splide .splide__list {
    height: 400px;
}
.no_javascript #tmp_tab_menu1 .splide__list,
#tmp_tab_menu1 .splide.no-splide .splide__list,
.no_javascript #tmp_tab_menu2 .splide__list,
#tmp_tab_menu2 .splide.no-splide .splide__list,
.no_javascript #tmp_tab_menu3 .splide__list,
#tmp_tab_menu3 .splide.no-splide .splide__list {
    height: 260px;
}


}