@charset "UTF-8"; @import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;700&display=swap'); html { font-size: 62.5%; margin: 0; padding: 0; } body { background: #ffffff; color: #1c1c1c; font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif; font-size: 1.4rem; letter-spacing: 0; line-height: 1.5; margin: 0; padding: 0; } b, strong, .bold{ font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI semibold", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic", "Segoe UI", Verdana, Meiryo, sans-serif; } .wrapper,#wrapper-main,#wrapper-footer footer { margin: 0 auto; width: 1100px; } #column-two { margin-top: 6rem; display: flex; justify-content: space-between; flex-wrap: wrap; } .top #column-two{ margin-top: 0;} #bloc-left { width: calc(100vw * (760 / 1100)); max-width: 760px; overflow: hidden; } ul,ol { margin: 0; padding: 0; } ul li, ol li { list-style: none; margin: 0; } table { border-collapse: collapse; } a { color: #333; text-decoration: none; word-break: break-all; transition: all 0.5s ease; } .mcol { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; } .cattag li { display: inline-block;} .cattag li:not(:last-of-type) { margin: 0 5px 2px 0;} .curator { /*background-color: #f7ede3;*/ background-repeat: no-repeat; background-position: left 10px center; margin: 0 10px; padding: 15px 0 10px 0px; } /* .thumbnail { background-size: 45px; padding: 10px 10px 10px 65px; } */ .thumbnail img { float: left; margin: -8px 0 0; width: 45px } .name-curator { /*font-family: "Hiragino Kaku Gothic W6 JIS2004";*/ font-weight: bold; text-align: left; } .curator time { display: block; font-size: 1.2rem; } .curator .thumbup { margin: 5px 0 0; font-size: 1.2rem; } .comment-curator { display: inline-block; margin: 0 0 0 6px; } .comment-curator span { display: inline-block; text-align: left; } .comment-curator span { position: relative; background: #f7ede3; line-height: 1; margin: 0 0 0 10px; padding: 5px 7px; } .comment-curator span:after { right: 100%; top: 50%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(255, 255, 255, 0); border-right-color: #f7ede3; border-width: 7px; margin-top: -7px; } #bloc-entrylist .info p.postscript { background-repeat: no-repeat; background-position: left 10px center; color: #777; font-size: 13px; font-size: 1.3rem; line-height: 1.2; min-height: 1em; margin: 10px 0 5px; } .body-entry a { color: #964f06; text-decoration: underline; } .body-entry a:hover { text-decoration: none; } figure.wp-caption { margin: 1em 0; } /* Hides from IE Mac \*/ * html .clearfix { height: 1%;} .clearfix { display: block;} .clearfix:after { content: "."; display: block; height: 0; font-size: 0; clear: both; visibility: hidden; } .font_pop{ font-family: 'Poppins', sans-serif; } .flex{ display: flex; flex-wrap: wrap; justify-content: space-between; } .mb_0 { margin-bottom: 0 !important; } .mb_30 { margin-bottom: 30px !important; } .fs_20 { font-size: 2rem; } /* カラーパレット */ :root { --color-cheki-black: #1c1c1c; --color-cheki-red: #DD1900; --color-cheki-green: #008178; --color-cheki-yellow: #FFC72F; --color-cheki-light-yellow: #FFFFCC; --color-cheki-hadairo: #FFCC99; } .has-cheki-black-color { color: var(--color-cheki-black);} .has-cheki-red-color { color: var(--color-cheki-red);} .has-cheki-green-color { color: var(--color-cheki-green);} .has-cheki-yellow-color { color: var(--color-cheki-yellow);} .has-cheki-light-yellow-color { color: var(--color-cheki-light-yellow);} .has-cheki-hadairo-color { color: var(--color-cheki-hadairo);} .has-cheki-black-background-color { background-color: var(--color-cheki-black);} .has-cheki-red-background-color { background-color: var(--color-cheki-red);} .has-cheki-green-background-color { background-color: var(--color-cheki-green);} .has-cheki-yellow-background-color { background-color: var(--color-cheki-yellow);} .has-cheki-light-yellow-background-color { background-color: var(--color-cheki-light-yellow);} .has--cheki-hadairo-background-color { background-color: var(--color--cheki-hadairo);} /****************************************** ヘッダー *******************************************/ #main-header{ width: 100%; background-color: #ffffff; } #main-header .wrapper{ padding-top: 4rem; /* margin-bottom: -2px; */ display: flex; justify-content: space-between; transition: all 0.5s ease; } #main-header h1{ position: relative; margin: 0; height: 177px; } #main-header h1 img{ position: absolute; z-index: 999; transition: all 0.5s ease; } #main-header .right{ display: flex; flex-direction: column; align-items: flex-end; } #main-header nav.sns li{ margin: 0 0 4rem 3rem; } #main-header nav ul{ display: flex; } #main-header #g_nav li:not(:first-child){ margin: 0 0 0 24px; } #main-header #g_nav li a{ display: block; font-size: 1.1rem; text-align: center; /* letter-spacing: 1px; */ position: relative; z-index: 1; } #main-header #g_nav li a span{ font-size: 1.5rem; font-weight: bold; font-family: 'Poppins', sans-serif; display: block; letter-spacing: 0; } #main-header #g_nav li a::before{ background: #ffc72f; content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; margin: auto; transform: scale(0, 1); transform-origin: right top; transition: transform .3s; z-index: -1; } #main-header #g_nav li a:hover::before { transform-origin: left top; transform: scale(1, 1); } #main-header.is-fixed{ position: fixed; top: 0; left: 0; z-index: 999; box-shadow: 0px 0px 6px rgba(0,0,0,26%); } #main-header.is-fixed .wrapper{ padding: 17px 0 13px; align-items:center; } #main-header.is-fixed .wrapper, #main-header.is-fixed h1{ height: 50px; min-height: 50px; } #main-header.is-fixed h1 img{ margin-bottom: auto; position: relative; height: 100%; width: auto; } #main-header.is-fixed .sns{ display: none; } #main-header.is-fixed + #wrapper-main{ padding-top: 90px; } .breadcrumb-area{ margin-bottom: 6rem; } .page-header{ display: flex; justify-content: center; align-items: center; height: 160px; background: url(../img/header/tl_main_y_pc.png) no-repeat center / 100%; } body.horoscope .page-header, body.chekipon-henshubu .page-header, body.writerwanted .page-header, body.authors .page-header{ background-image: url(../img/header/tl_main_b_pc.png); } .page-header h2{ margin: 0; padding-top: 12px; } .page-header h2 .title_slug_text{ font-size: 32px; } .page-header h2.tag_title{ margin-top: -18px; padding-top: 0; color: #ffffff; font-size: 42px; line-height: 1; text-align: center; text-shadow: 2px 4px 0 #000, -2px 2px 0 #000, 2px -2px 0 #000, -2px -2px 0 #000; } .page-header h2.tag_title span{ font-size: 32px; text-shadow: none; } /******************************************* フッター *******************************************/ .footer_deco{ margin-top: 100px; display: block; width: 100%; height: 48px; background: url(../img/deco01.svg) repeat top left / contain; } footer.entry-footer{display: none;} footer { position: relative; padding: 6rem 0 4.2rem; vertical-align: bottom; background: #FFC72F; } .page_top{ position: absolute; top: 0; left: calc(50vw + 460px); cursor: pointer; display: block; transition: all 0.3s ease; } .page_top:hover img{ filter: drop-shadow(4px 4px 0 rgba(0,0,0,0.2)); } footer .flex{ margin-bottom: 3rem; display: flex; justify-content: space-between; } footer nav ul{ display: flex; } footer .sns ul{ margin-bottom: 3rem; } footer .sns ul li{ margin-right: 2.4rem; } footer .sns ul li img{ height: 28px; width: auto; } footer .right{ background: url(../img/im_line.svg) repeat-x bottom left / 100%; } footer .nav_footer ul{ margin-bottom: 1em; } footer .nav_footer ul li{ margin: 0; padding: 0; line-height: 1em; } footer .nav_footer ul li:not(:last-child){ padding-right: 1em; border-right: 2px solid #1c1c1c; } footer .nav_footer ul li:not(:first-child){ padding-left: 1em; } footer .nav_footer ul li a{ position: relative; z-index: 1; font-size: 1.6rem; font-family: 'Poppins', sans-serif; line-height: 1em; } footer .nav_footer li a::before, footer .nav_footer_other li a::before{ background: #ffffff; content: ""; display: block; width: 100%; height: 100%; position: absolute; left: 0; bottom: 0; margin: auto; transform: scale(0, 1); transform-origin: right top; transition: transform .3s; z-index: -1; } footer .nav_footer li a:hover::before, footer .nav_footer_other li a:hover::before{ transform-origin: left top; transform: scale(1, 1); } footer .nav_footer_other{ margin-bottom: 2em; } footer .nav_footer_other li{ margin-right: 2em; } footer .nav_footer_other li a { position: relative; z-index: 1; font-size: 1.6rem; font-family: 'Poppins', sans-serif; font-weight: bold; } footer .bnr_page ul{ justify-content: space-between; } footer .bnr_page ul li:not(:first-child){ margin-left: 20px; } footer .bnr_page ul li a:hover{ filter: drop-shadow(8px 8px 0 rgba(0,0,0,0.5)); } footer .bnr_page ul li img{ width: 100%; } #copyright { background-color: #ffffff; margin: 0; padding: 1rem 0; text-align: center; font-family: 'Poppins', sans-serif; } #search-footer { margin: 18px 0 0; } #search-footer #search { width: 320px; margin: auto; position: relative; } #search-footer #search label { color: #dc7d42; display: inline-block; position: absolute; top: .2rem; left: 1rem; } #search-footer #search input { border-color: #dc7d42; border-radius: 5px; border-style: solid; border-width: 1px; padding: 0 0 0 2rem; width: 215px; } #search-footer #search button { background: #dc7d42; border: none; /*border-radius: 5px;*/ color: #fff; margin: 0 0 0 .5rem; padding: .1rem 1rem; } #search-footer #search button:first-letter { letter-spacing: 1rem; } /******************************************* サイドカラム /*******************************************/ #bloc-right { margin: 0px; width: calc(100vw * (280 / 1100)); max-width: 280px; } #bloc-right h2{ margin: -20px 0 -12px; width: 100%; } #bloc-right h2 img{ width: 100%; } #bloc-right .ranking ol{ margin-top: 0px; margin-bottom: 60px; padding: 26px 28px 26px; background-color: #FFC72F; border-radius: 0px 0px 10px 10px; } #bloc-right .ranking li{ position: relative; margin-bottom: 24px; } #bloc-right .ranking li .photo::before{ content: ""; position: absolute; top: -8px; left: -8px; display: block; width: 30px; height: 30px; background-repeat: no-repeat; background-position: center; background-size: cover; } #bloc-right .ranking li:nth-of-type(1) .photo::before{background-image: url(../img/top/ic_1.svg);} #bloc-right .ranking li:nth-of-type(2) .photo::before{background-image: url(../img/top/ic_2.svg);} #bloc-right .ranking li:nth-of-type(3) .photo::before{background-image: url(../img/top/ic_3.svg);} #bloc-right .ranking li:nth-of-type(4) .photo::before{background-image: url(../img/top/ic_4.svg);} #bloc-right .ranking li:nth-of-type(5) .photo::before{background-image: url(../img/top/ic_5.svg);} #bloc-right .ranking .photo img{ border-radius: 8px; } #bloc-right .ranking .info{ margin-left: 10px; font-size: 13px; font-weight: bold; text-align: left; } .black_bg,.btn_search_close{ display: none; } #search form{ margin-bottom: 20px; padding: 20px; background: url(../img/bg_serch.svg) repeat center / auto; border-radius: 10px; } #search .word, #search select{ position: relative; padding: 7px 16px; width: 100%; height: 46px; border: 2px solid var(--unnamed-color-1c1c1c); background: #FFFFFF 0% 0% no-repeat padding-box; border: 2px solid #1C1C1C; border-radius: 100px; box-sizing: border-box; appearance: none; } #search select option{ color: #1c1c1c; } #search form div input[type="text"] { margin-left: 4px; border: none; font-size: 14px; line-height: 2; } #search form div input:focus{ outline: none; } #search form div input[type="image"]{ position: absolute; top: 12px; right: 15px; } #search form.select_cat_area{ margin-bottom: 40px; } #search h3{ margin: 10px 0; } #search h4{ margin: 0 0 4px; } #search input[type="submit"]{ margin: 40px auto 0; padding: 6px 10px; display: block; width: 128px; height: 36px; color: #ffffff; font-size: 14px; text-align: center; font-weight: bold; background: var(--unnamed-color-1c1c1c) 0% 0% no-repeat padding-box; background: #1C1C1C 0% 0% no-repeat padding-box; border: none; border-radius: 18px; box-sizing: border-box; transition: all 0.5s ease; } #search input[type="submit"]:hover{ box-shadow: 8px 8px rgba(0,0,0,0.3); } .searchandfilter ul{ width: 100%; } .searchandfilter li{ position: relative; margin-bottom: 20px; padding-right: 0; display: block; } .searchandfilter li:not(:last-child)::after{ content: ""; display: block; width: 6px; height: 6px; position: absolute; top: 64%; right: 20px; border-bottom: 2px solid #1c1c1c; border-left: 2px solid #1c1c1c; transform: rotate(-45deg); } .hide{ display: none; } .tag_cloud{ margin-bottom: 40px; } .tag_cloud ul{ display: flex; flex-wrap: wrap; } .tag_cloud li a{ margin: 0px 4px 6px 0; padding: 0px 8px; display: block; border: 1px solid #CCCCCC; border-radius: 13px; font-size: 14px; } /* .st-tag-cloud{ margin-top: 20px; font-weight: normal; } */ .bnr_area{ margin-bottom: 50px; } .bnr_area li{ margin-bottom: 20px; /* padding: 20px 0; */ text-align: center; font-size: 24px; font-weight: bold; /* background: #CCCCCC; */ } .bnr_area li a{ display: block; } .bnr_area li a:hover{ transform: scaleY(1.1); } .bnr_area li img{ width: 100%; } .magazine{ margin-bottom: 50px; padding-bottom: 24px; justify-content: left; border-bottom: 2px solid #1c1c1c; } .magazine h3{ margin-top: 0; } .magazine .magazine_sum{ margin-right: 22px; width: 130px; } .magazine .icon_digitalbook{ width: 110px; } .magazine .flex > div{ width: 120px; } .magazine p{ margin-top: 0; } .from_editors{ margin-bottom: 40px; padding: 34px 20px 20px 20px; background-color: #EEEEEE; } .from_editors h3{ margin-top: -44px; text-align: center; } .from_editors li{ margin-bottom: 10px; } .from_editors li a{ display: block; } /* .side_ad_area{ } */ .side_ad_area li{ margin-bottom: 40px; position: relative; list-style: none; } .side_ad_area li::before{ content: "PR"; padding: 4px 6px; position: absolute; top: 0 ; left: 0; background-color: #EEEEEE; font-size: 12px; letter-spacing: 2px; } .side_ad_area h3{ margin-top: 0; } .side_ad_area img{ width: 100%; } /******************************************* トップページ ********************************************/ #top_slider{ position: relative; margin-bottom: calc(100vw * (40 / 760)) !important; height: 512px; } #top_slider .slick-list{ height: 44rem; overflow: visible !important; } #top_slider .slider li img.slide_image{ width: 100%; max-width: 760px; height: auto; max-height: 440px; object-fit: cover; } #top_slider .slider li img.slide_deco{ position: absolute; top: 0; left: 0; z-index: 333; width: 500px; height: 512px; } #top_slider .slide_info{ padding-top: 15px; position: absolute; top: 404px; left: 3rem; z-index: 444; } #top_slider .slide_title{ margin: 0 0 10px; padding-bottom: 10px; width: 450px; font-size: 16px; font-weight: bold; letter-spacing: 1px; border-bottom: 1px solid #1c1c1c; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } #top_slider .slide_cat{ margin: 0; font-size: 14px; text-transform: uppercase; } #top_slider .slick-dots{ bottom: -68px; left: 30px; width: auto; } #top_slider .slick-dots li, #top_slider .slick-dots li button, #top_slider .slick-dots li button:before{ width: 16px; height: 16px; font-size: 20px; } #top_slider .slick-dots li button:before{ color: #ffffff; } #top_announce{ margin-bottom: 58px; padding: 34px 124px; background-color: #FFFFCC; text-align: center; font-size: 15px; } #top_announce .top_announce_title{ font-size: 18px; font-weight: bold; } #new_topics{ margin-bottom: 80px; } #new_topics ul{ display: flex; flex-wrap: wrap; justify-content: space-between; } #new_topics ul li{ margin-bottom: 44px; width: 36rem; overflow: hidden; } #new_topics ul li:nth-of-type(5), #new_topics ul li:nth-of-type(6){ margin-bottom: 24px; } #new_topics ul li img{ width: 36rem; height: 36rem; object-fit: cover; transition: all 0.5s ease; } #new_topics ul li img:hover{ transform: scale(110%); } .new_topics_text{ position: relative; padding: 16px 7px 42px 30px; font-size: 15px; font-weight: bold; background: #ffffff url(../img/top/im_waku.svg) no-repeat left top / 100%; } #new_topics .cat{ position: absolute; top: -22px; left: 0; padding: 4px 10px 2px; font-size: 14px; font-family: 'Poppins', sans-serif; font-weight: bold; text-transform: uppercase; background: #ffffff; border: 1px solid #1C1C1C; border-radius: 100px; } .btn_black{ margin: auto; padding: 12px 0 10px; display: block; width: 216px; font-size: 18px; text-align: center; letter-spacing: 0px; color: #ffffff; border-radius: 25px; background: #1C1C1C 0% 0% no-repeat padding-box; } .btn_black:hover{ box-shadow: 8px 8px 0 rgba(0, 0, 0, 0.3); } #tourisum{ margin-bottom: 80px; padding: 25px 30px 40px 0; background-color: #FFFFCC; } #tourisum .flex{ margin-bottom: 30px; } #bloc-entrylist #tourisum h2{ margin-right: 14px; } #tourisum .first_post{ margin-right: 30px; padding-top: 35px; width: 380px; } #tourisum .first_post .tourisum_info{ margin-top: 10px; font-size: 20px; text-align: center; font-weight: bold; } #tourisum .other_post{ width: 220px; } #tourisum .other_post a{ margin-bottom: 30px; } #tourisum .other_post .tourisum_info{ font-size: 15px; text-align: left; font-weight: bold; } #tourisum .mskimg{ margin: 0; mask-image: url(../img/top/im_tou01.svg);/*マスクレイヤーとして使用する画像*/ mask-repeat: no-repeat; mask-position: 0; mask-size: 100%; -webkit-mask-image: url(../img/top/im_tou01.svg); -webkit-mask-repeat: no-repeat; -webkit-mask-position: 0; -webkit-mask-size: 100%; } #tourisum .mskimg img{ transition: all 0.5s ease; } #tourisum .mskimg img:hover{ transform: scale(110%); } #event{ margin-bottom: 80px; } #event .event_slider{ margin-bottom: 40px; padding-top: 60px; } #event .event_slider li{ margin: 0 0 0 20px; padding: 20px 10px; width: 208px; background: #FFEEC9; box-sizing: border-box; } #event .event_slider li img{ margin-bottom: 10px; width: 188px; height: 125px; object-fit: cover; } #event .event_slider .event_slider_info{ height: 5.8em; line-height: 1.5; overflow: hidden; } #event .event_slider .prev-arrow{ top: 30px; right: 50px; z-index: 998; } #event .event_slider .next-arrow{ top: 30px; right: 0; z-index: 998; } .event_period{ height: 40px; text-align: center; display: inline-block; } .event_period p{ margin: auto; padding: 4px 15px 5px 15px; display: inline-block; font-size: 16px; line-height: 1; font-family: 'Poppins', sans-serif; border: 1px solid #1C1C1C; border-radius: 25px; } .event_period p::before{ content: ""; margin-right: 4px; display: inline-block; width: 18px; height: 20px; background: url(../img/top/ic_sk18.svg) no-repeat center / cover; vertical-align: -3px; } #event .event_period{ margin: auto; padding-left: 0; display: block; background-image: none; text-align: center; } #pickup{ margin-bottom: 80px; } #pickup ul{ display: flex; flex-wrap: wrap; justify-content: space-between; } #pickup ul li{ padding: 0 10px; width: 165px; border-radius: 100%; } #pickup ul li img{ margin-bottom: 10px; width: 165px; height: 165px; object-fit: cover; border-radius: 100%; border: 6px solid #ffffff; /* outline: solid 1px #000; */ box-shadow: 0 0 0 2px #1c1c1c; box-sizing: border-box; transition: all 0.5s ease; } #pickup ul li img:hover{ transform: scale(110%); } .pickup_text{ margin-bottom: 20px; font-size: 15px; font-weight: bold; } #pickup ul li .cat{ padding: 0 8px 1px; font-size: 13px; font-weight: bold; text-transform: uppercase; border:1px solid #1C1C1C; border-radius: 14px; } #area{ position: relative; padding: 25px 25px 30px 55px; background-color: #FFFFCC; } #area h2{ position: absolute; top: -22px; left: 108px; } #area .flex{ width: 100%; height: 100%; align-items: center; } #area .area_list{ width: 300px; } #area .area_list li{ margin-bottom: 20px; } #area .area_list li:last-child{margin-bottom: 0;} #area .area_list li a{ padding: 10px 0 10px 14px; display: block; font-size: 14px; font-weight: bold; line-height: 1; box-shadow: 2px 2px 0px #000000; border: 1px solid #1C1C1C; border-radius: 28px; background-color: #ffffff; } #area .area_list li a:hover{ background-color:#E5D948; } #area .area_list li a::before{ margin-right: 8px; content: ""; display: inline-block; width: 10px; height: 14px; background: url(../img/top/pin.svg) no-repeat center / 100%; vertical-align: -2px; } #area .area_map{ display: block; width: 300px; height: 404px; background: url(../img/top/area00.png) no-repeat center / 100%; transition: all 0.5s ease; } #area .area_map.area01{background-image: url(../img/top/area01.png);} #area .area_map.area02{background-image: url(../img/top/area02.png);} #area .area_map.area03{background-image: url(../img/top/area03.png);} #area .area_map.area04{background-image: url(../img/top/area04.png);} #area .area_map.area05{background-image: url(../img/top/area05.png);} #area .area_map.area06{background-image: url(../img/top/area06.png);} /*======================================================================= ▲▲▲トップページここまで▲▲▲ =======================================================================/* /* アーカイブ(記事一覧) */ h1.archive_title{ margin-top: 0; margin-bottom: 40px; padding-bottom: 4px; font-size: 32px; font-family: 'Poppins', sans-serif; text-transform: uppercase; border-bottom: 2px solid #1c1c1c; } #bloc-entrylist { padding: 0 0 60px 0; /* background: #fff; */ box-sizing: border-box; } #bloc-entrylist h2 { font-size: 18px; font-size: 1.8rem; margin: 0 0 20px; } #bloc-entrylist article .photo a { display: block; height: 240px; width: 240px; } #bloc-entrylist article .photo a img { width: 100%; height: 100%; object-fit: cover; } #bloc-entrylist article{ margin-bottom: 40px; padding-bottom: 40px; border-bottom: 1px dashed #1C1C1C; } #bloc-entrylist .icon { position: absolute; left: 5px; top: 5px; } #bloc-entrylist .info { margin-left: 40px; } #bloc-entrylist .release_date{ color: #cccccc; text-align: right; } #bloc-entrylist .info .area_list{ margin-bottom: 14px; padding-top: 5px; float: right; font-size: 14px; display: flex; flex-wrap: wrap; justify-content: right; } #bloc-entrylist .info .area_list li{ margin-left: 8px; padding-left: 14px; background: url(../img/top/pin.svg) no-repeat left center / 10px; } #bloc-entrylist .info h3 { margin: 0 auto 14px; font-size: 20px; line-height: 1.6; clear: both; } #bloc-entrylist .info p { margin: 0 auto 14px; line-height: 1.7; } #bloc-entrylist .info .cat{ padding: 2px 10px 2px; font-size: 14px; font-family: 'Poppins', sans-serif; font-weight: bold; text-transform: uppercase; background: #ffffff; border: 1px solid #1C1C1C; border-radius: 100px; } #bloc-entrylist .info .cattag { margin: 15px 0 5px; min-height: 21px; } #bloc-entrylist .info .cattag li { background: #f7ede3; display: inline-block; padding: 0 .5rem } #bloc-entrylist .info .curator { margin: .5rem 0 0; } #bloc-entrylist .info time, #bloc-entrylist .info .thumbup { -webkit-flex-basis: 50%; flex-basis: 50%; } #bloc-entrylist .info .thumbup { text-align: right; } /* #bloc-entrylist nav.pagination { margin: 15px 0 0; padding: 0 2.0rem; } */ #bloc-entrylist nav.pagination .nav-links{ text-align: center; } #bloc-entrylist nav.pagination a, #bloc-entrylist nav.pagination .nav-links > span{ margin: 0 3px; padding-top: 8px; width: 40px; height: 40px; display: inline-block; box-sizing: border-box; background-color: #ffffff; color: #1c1c1c; font-size: 15px; font-weight: bold; border: 1px solid #1c1c1c; border-radius: 100%; } #bloc-entrylist nav.pagination .nav-links > span{ background-color: #1C1C1C; color: #ffffff; } #bloc-entrylist nav.pagination a:hover { text-decoration: underline; } /* .navigation .nav-links .current { text-decoration: underline; } .page-numbers.current { text-decoration: underline; } */ #bloc-entrylist nav.pagination .nav-links > span.page-numbers.dots{ display: none;} .page-numbers.prev,.page-numbers.next{ display: inline-block; text-indent: -9999px; } .page-numbers.prev{ background: url(../img/ar_left.svg) no-repeat center / 10px; } .page-numbers.next{ background: url(../img/ar_right.svg) no-repeat center / 10px; } p.archive-past { margin: 20px 0 0 0; text-align: right; } p.archive-past a { text-decoration: underline; } p.archive-past a:hover { text-decoration: none; } /* ********************************************************************************** 記事詳細ページ ********************************************************************************** */ .bloc-entry, .bloc-comment { margin-bottom: 60px; /* background: #fff; */ } .bloc-entry hr { border-color: #e6e6e6; border-style: solid; margin: 30px auto 0; } .header-entry { margin-bottom: 40px; } .header-entry .flex{ align-items: flex-start; } /* 記事共通パーツ */ .header-entry h1 { margin: 12px auto 10px; padding: 0; font-size: 28px; line-height: 42px; } .bloc-entry h2{ margin: 0 auto 40px; padding: 16px 20px; font-size: 24px; background-color: #FFC72F; border-radius: 10px; } .bloc-entry h3, .bloc-comment h3, .bloc-entry .yarpp-related h3 { margin: 0 auto 30px; padding-bottom: 16px; font-size: 20px; font-weight: bold; border-bottom: 2px solid #1C1C1C; } .bloc-entry h4{ margin: 0 auto 30px; font-size: 18px; font-weight: bold; } .bloc-entry p{ margin-bottom: 20px; font-size: 16px; line-height: 2; } .bloc-entry img{ max-width: 100%; width: 100%; } .bloc-entry .wp-block-table table{ border-top: 2px solid #1C1C1C; border-bottom: 2px solid #1C1C1C; } .bloc-entry .wp-block-table table thead{ background-color: #FFC72F; border-bottom: none; } .bloc-entry .wp-block-table table td{ padding: 12px; border: 1px dotted #1C1C1C; } .bloc-entry .wp-block-button__link{ margin-bottom: 40px; text-decoration: none; background: #fff; color: #1c1c1c; font-size: 15px; border: 2px solid #1c1c1c; border-radius: 6px; } .bloc-entry .wp-block-button__link:hover{ color: #1c1c1c; background-color: #EEEEEE; } .bloc-entry .linkcard{ margin: 0 0 40px; } .bloc-entry .linkcard .lkc-favicon{ width: auto; } .bloc-entry .lkc-content{ height: auto; } .bloc-entry .lkc-content .lkc-title{ margin: 10px 0 20px; } .bloc-entry .lkc-internal-wrap{ max-width: 98%; border-radius: 10px; box-shadow: 10px 8px 0px #1C1C1C; } .bloc-entry .lkc-card{ padding: 14px 20px 20px; background-color: #ffffff; } .bloc-entry .lkc-url{ margin-bottom: 8px; text-decoration: none; } /* .bloc-entry ol{ } */ .bloc-entry ol li{ margin: 0 0 20px; counter-increment: ol_ct 1; font-size: 15px; } .bloc-entry ol li::before{ content: counter(ol_ct); margin-right: 10px; padding: 4px 10px 5px 9px; border: 1px solid #1C1C1C; font-style: italic; border-bottom-right-radius: 10px; } .bloc-entry .curator { margin: 20px auto 100px; padding: 20px 40px 20px; background-color: #fff; border: 1px solid #1C1C1C; border-radius: 10px; box-sizing: border-box; } .bloc-entry .curator .ulike_wrapp{ margin-bottom: 14px; display: flex; /* padding: 0 40px; */ justify-content: center; align-items: center; } .bloc-entry .curator .ulike_wrapp p{ margin: 0 40px 0 0; } .bloc-entry .curator .ulike_wrapp img{ width: 30px; margin-bottom: -6px; } .bloc-entry .curator .ulike_wrapp + img{ margin-bottom: 10px; } .bloc-entry .curator .curator_profile{ flex-wrap: nowrap; justify-content: left; } .bloc-entry .curator .curator_profile a.thum{ margin-right: 20px; width: 80px; } .bloc-entry .curator .curator_profile a.thum img{ max-width: initial; width: 90px; height: 90px; } .bloc-entry .curator .curator_profile .name-curator, .curator .curator_profile .name-curator{ color: #1C1C1C; text-decoration: none; } .bloc-entry .curator .curator_profile .writer_description{ margin: 0; } .yarpp-thumbnails-horizontal{ margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: space-between; } .yarpp-thumbnails-horizontal .yarpp-thumbnail{ width: 160px !important; height: auto !important; border: none !important; } .yarpp-thumbnails-horizontal .yarpp-thumbnail img{ width: 160px !important; height: 160px !important; object-fit:cover; } .yarpp-thumbnails-horizontal .yarpp-thumbnail-title{ width: 160px !important; } .bloc-comment form p input, .bloc-comment form p textarea{ margin-bottom: 20px !important; } /* ************************************************************ */ .bloc-entry .image-main { margin-bottom: 60px; } .bloc-entry .image-main h2{ margin: 0; padding: 0; background: none; } .bloc-entry .image-main img{ width: 760px; height: auto; object-fit:contain; } .bloc-entry p.event_period, #bloc-entrylist .info .event_period, .bloc-entry p.spot_open, #bloc-entrylist .info .spot_open{ margin: 0; font-size: 18px; text-align: left; font-weight: bold; line-height: 1.5; } .bloc-entry p.spot_open, #bloc-entrylist .info .spot_open{ padding-left: 54px; display: inline-block; background: url(../img/post/ic_open.svg) no-repeat left center / 48px; } .bloc-entry p.event_period, #bloc-entrylist .info .event_period{ padding-left: 30px; background: url(../img/post/ic_sch20.svg) no-repeat left 3px / 20px; } .bloc-entry .area_list{ float: right; padding-left: 22px; background: url(../img/post/ic_pin20.svg) no-repeat left center / 20px; } .bloc-entry .area_list li{ background-color: initial; font-size: 16px; } .bloc-entry .cat{ padding: 0 8px 1px; font-size: 15px; font-weight: bold; text-transform: uppercase; border: 1px solid #1C1C1C; border-radius: 14px; } .bloc-entry time{ color: #666666; } .bloc-entry .body-entry { margin: 0 auto; } /* イベント/スポット スペック表示 */ .info-entry, .event_info { margin: 0 auto 40px; padding: 24px 40px; font-size: 15px; border: 2px solid #1C1C1C; border-radius: 10px; overflow: hidden; transition: max-height 0.5s ease; } .info-entry.close, .event_info.close { position: relative; max-height: 70px; transition: max-height 0.5s ease; } .info-entry.close .info_open, .event_info.close .info_open{ display: block; position: absolute; bottom: 0; left: 50%; transform: translate(-50%, 0); -webkit-transform: translate(-50%, 0); -ms-transform: translate(-50%, 0); } .info-entry.close dl, .event_info.close dl, .info-entry.close table, .event_info.close table, .info-entry.close .info_close, .event_info.close .info_close, .info-entry.close .map, .event_info.close .map{ display: none; } .info-entry.close h3, .event_info.close h3{ border: none; } .info_block .info-entry.open, .info_block .event_info.open { max-height: 2000px; transition: max-height 0.5s ease; } .info-entry h3{ margin: 0; padding-bottom: 20px; font-size: 20px; border-bottom: 1px dashed #c6c6c6; } .info-entry h3 span{ display: block; font-size: 12px; font-weight: normal; } .info-entry h4 { margin: 0 0 20px; padding-bottom: 20px; font-size: 20px; border-bottom: 1px dashed #c6c6c6; } .info-entry dl, .info-entry table tr, .event_info table tr{ margin: 0; padding: 16px 0; display: flex; text-align: left; border-bottom: 1px dashed #c6c6c6; } .info-entry dl dt, .info-entry table th, .event_info table th{ font-weight: bold; width: 178px; } .info-entry dl dd, .info-entry table td, .event_info table td{ width: 478px; line-height: 1.5; } .info-entry dl:last-child, .info-entry table tr:last-child, .event_info table tr:last-child{ border: none; } .info-entry .gmap, .event_info .gmap{ margin-top: 20px; padding: 2px 5px 2px; display: block; width: 86px; background-color: #1c1c1c; color: #ffffff; font-size: 12px; text-align: center; border-radius: 15px; } .info-entry .info_close, .event_info .info_close{ margin: 30px auto 0; text-align: center; } .info-entry .info_close a, .info_open a, .event_info .info_close a, .event_info .info_open a{ padding-right: 20px; font-size: 16px; font-weight: bold; line-height: 1; text-align: center; cursor: pointer; background: url(../img/post/bt_close.svg) no-repeat right 3px / 15px; } .info_open{ margin: -20px auto 0; display: block; text-align: center; } .info-entry .info_open a, .event_info .info_open a{ background-image: url(../img/post/bt_open.svg); } .info-entry.open .info_open a, .event_info.open .info_open a{ display: none; } /* .info-entry.open dl, .event_info.open dl{ display: block;} */ .info-entry li i { margin: 0 5px 0 0; } .info-entry-simple { display: table; } .info-entry-simple h4 { color: #dc7d42; font-size: 15px; font-size: 1.5rem; margin: 15px 0 5px; } .info-entry-simple h4:before { background-color: #f7ede3; content: ""; display: inline-block; margin: 0 4px 0 0; height: 11px; width: 11px; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; } .info-entry-simple table { display: table-cell; } .info-entry-simple table:first-of-type { padding: 0 20px 0 0; min-width: 200px; } .info-entry-simple table th { line-height: 1.2; width: 12px; vertical-align: top; } .info-entry-simple table th img { height: 12px; width: 12px; } .info-entry-simple table td { color: #dc7d42; font-size: 12px; font-size: 1.2rem; line-height: 1.2; } .info-entry-simple table td a { color: #dc7d42; text-decoration: underline; word-break: break-all; } .bloc-entry .mokuji{ margin-bottom: 40px; position: relative; padding: 48px 40px 26px; background-color: #EEEEEE; border-radius: 10px; } .bloc-entry .mokuji::before{ content: ""; display: block; width: 52px; height: 36px; position: absolute; top: -14px; left: 40px; background: url(../img/post/ic_mokuji.svg) no-repeat center / 100%; } .bloc-entry .mokuji li{ margin-bottom: 18px; padding-left: 24px; font-size: 16px; background: url(../img/post/ic_ar_down.svg) no-repeat left center / 13px; } .bloc-entry .mokuji li a{ color: #1C1C1C; } /* .bloc-comment { margin: 20px 0 0; padding: 25px; } */ .bloc-comment h2 { /*font-family: "Hiragino Kaku Gothic W6 JIS2004";*/ font-size: 14px; font-size: 1.4rem; margin: 0 0 10px; } .bloc-comment form { display: table; margin: 25px auto; padding: 40px; width: 100%; background-color: #FFFFCC; box-sizing: border-box; } /*.bloc-comment form ul { display: table; width: 100%; }*/ .bloc-comment .comment-reply-title{ border: none; margin: 0%; } .bloc-comment form p { display: block; width: 100%; } .bloc-comment form p.comment-notes { display: block; } .bloc-comment form p label, .bloc-comment form p input, .bloc-comment form p textarea { display: table-cell; width: 97%; vertical-align: top; } .bloc-comment form p input { /* width: 50%; */ } .bloc-comment form p label { /* padding: 0 10px 20px; */ /* text-align: right; */ /* width: 15%; */ margin-bottom: 10px; display: block; font-size: 15px; font-weight: bold; } .bloc-comment form p input, .bloc-comment form p textarea { margin: 0 auto 40px; padding: 5px; background: #ffffff; border: none; border-radius: 5px; -webkit-box-shadow: none; box-shadow: none; border: 2px solid #1c1c1c; border-radius: 6px; } .bloc-comment .form-submit { text-align: center; } .bloc-comment .form-submit input { margin-bottom: 0; padding: 10px 0; width: 216px; height: 48px; font-size: 18px; color: #fff; background: #1c1c1c; border: none; border-radius: 25px; letter-spacing: 4px; transition: all 0.5s ease; } .bloc-comment .form-submit input:hover { box-shadow: 8px 8px 0 rgba(0,0,0,0.3); } .bloc-comment .reply h4 { display: inline-block; margin: 0 10px 10px 0; font-size: 15px; } .bloc-comment .reply time { display: inline-block; font-size: 12px; font-size: 1.2rem; } .bloc-comment .reply p { margin: 5px 0 0; } .bloc-comment .reply .item-reply{ margin-bottom: 12px; padding: 20px; background-color: #FFFFCC; } .entry header ul { margin: 0 0 1.5rem; padding: 0 0 0 2.0rem; } .entry header li { background: #f7ede3; display: inline-block; padding: 0 .5rem; } /* .curator time, .curator .thumbup { -webkit-flex-basis: 65%; flex-basis: 65%; } */ .curator .thumbup { /* margin: 0 0 0 5%; */ text-align: left; } .curator .thumbup p { margin: 0; } /* .entry h3 { color: #dc7d42; } */ .entry .topics { margin: 1.0rem 0 2.5rem; } .entry .topics h4 { margin: 0; } .entry .topics h4 span { background: #f1e5c9; border-radius: 5px 5px 0 0; color: #fff; padding: .3rem 1.5rem 0; } .entry .topics .body-topics { /* background: url(../img/bg_stripe01.gif); */ /* background: repeating-linear-gradient(-45deg, #FFC72F, #FFC72F 8px, #ffffff 8px, #ffffff 16px); */ padding: 1.4rem; border: 10px solid #eeeeee; border-radius: 16px; } .entry .topics .inner { background: #ffffff; padding: 2.4rem; border-radius: 10px; } /* .info-entry table { width: 100%; } .info-entry th, .info-entry td { border: 1px solid #dc7d42; padding: 2.0rem 0; } .info-entry th { background: #f2f2f2; width: 30%; } .info-entry td { color: #333; padding: 2.0rem 1.0rem; } .info-entry .map { margin: 2.0rem 0 0; } */ .bloc-comment .mcol{ justify-content: space-between; } .bloc-comment .mcol h2, .bloc-comment .mcol .thumbup { -webkit-flex-basis: 50%; flex-basis: 50%; } .bloc-comment .mcol .thumbup, .bloc-comment .mcol .thumbup { display: flex; } .bloc-comment .mcol .thumbup .fb_iframe_widget, .bloc-comment .mcol .thumbup .twitter-share-button, .bloc-comment .mcol .thumbup .comment-curator { vertical-align: top; } .bloc-comment .mcol .thumbup .fb_iframe_widget{ margin-bottom: 0; } .gallery-entry { flex-wrap: wrap; margin: 4.0rem 0 0; } .gallery-entry figure { -webkit-flex-basis: -webkit-calc(100% / 3); flex-basis: calc(100% / 3); margin: 0; text-align: center; } .gallery-entry figure:nth-of-type(n+4) { margin: 3.0rem 0 0; } .gallery-entry figure figcaption { font-size: 1.1rem; margin: 0 auto; text-align: left; width: 18rem; } .street .movie { margin: 3.0rem auto 0; width: 63rem; } .yarpp-related { margin: 0 !important; } /** 新着 **/ #bloc-new { background: #fff; padding: 20px 0 10px; } #bloc-new>ul>li { -webkit-flex-basis: -webkit-calc(100% / 3); flex-basis: calc(100% / 3); flex-grow: 1; position: relative; } #bloc-new .cattag { margin: 1.0rem 1.5rem 5px; } #bloc-new .cattag li { background: #f7ede3; display: inline-block; padding: 0 .5rem; } #bloc-new .icon, #bloc-new .photo, #bloc-new .info { display: block; } #bloc-new .icon { position: absolute; /*left: 20px;*/ left: calc((100% - 316px) / 2); z-index: 1; } #bloc-new .photo { /*border: 2px dotted #f7f2e5;*/ margin: 0 auto; text-align: center; height: 220px; width: 312px; overflow: hidden; padding: 2px; position: relative; } #bloc-new .photo img { max-width: 100%; height: auto; vertical-align: bottom; position: absolute; right: 0; left: 0; top: 0; bottom: 0; margin: auto; } #bloc-new .info { font-size: 19px; font-size: 1.9rem; font-weight: bold; margin: 5px 0 0; min-height: 5.6rem; padding: 5px 1.5rem 0; text-align: left; } /** フキダシ **/ .fukidashi { position: relative; margin: 0 auto 60px; padding: 20px; display: flex; border-radius: 10px; } .fukidashi::after{ content: ""; display: block; width: 0; height: 0; position: absolute; bottom: -8px; right: -12px; border-style: solid; border-right: 18px solid transparent; border-left: 18px solid transparent; border-bottom: 18px solid #FFFFCC; border-top: 0; transform: rotate(45deg); visibility: visible; z-index: 777; } .fukidashi.r { flex-direction: row-reverse; justify-content: right; background-color: #fffbd9; background-position: 98%; } .fukidashi.l { flex-direction: row; justify-content: left; background-color: #FFCC99; background-position: 20px; } .fukidashi.l::after{ left: -12px; right: initial; border-bottom: 18px solid #FFCC99; transform: rotate(-45deg); } .fukidashi.l .fukidashi_thum{margin-right: 20px;} .fukidashi.r .fukidashi_thum{margin-left: 20px;} .fukidashi .fukidashi_thum img{ width: 60px; height: 60px; } .fukidashi .name { font-size: 12px; font-size: 1.2rem; line-height: 1.1; width: 5em; text-align: center; font-weight: bold; z-index: 999; } .fukidashi p{ margin: 0; font-size: 15px; } /* フキダシ形状 */ /**考える**/ .fukidashi p.think { border-radius: 50px; } .fukidashi p.l.think { margin: 15px 0 5px 90px; } .fukidashi p.l.think:before { position: absolute; top: 24px; left: -17px; height: 15px; width: 15px; background: #D9E5FF; border-radius: 10px; content: ""; } .fukidashi p.l.think:after { position: absolute; top: 20px; left: -28px; height: 10px; width: 10px; background: #D9E5FF; border-radius: 5px; content: ""; } .fukidashi p.r.think { margin: 15px 90px 5px 0; } .fukidashi p.r.think:before { position: absolute; top: 24px; right: -17px; left: auto; height: 15px; width: 15px; background: #D9E5FF; border-radius: 10px; content: ""; } .fukidashi p.r.think:after { position: absolute; top: 20px; right: -28px; left: auto; height: 10px; width: 10px; background: #D9E5FF; border-radius: 5px; content: ""; } /**LINE風**/ .fukidashi p.l.line { border-radius: 0 15px 15px 15px; box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.4), 0 10px 10px rgba(255, 255, 255, 0.5) inset, 0 -10px 10px rgba(0, 0, 0, 0.1) inset; position: relative; z-index: 2; padding: 6px 12px; background-color: #FCFCFC; border-style: solid; border-width: 1px; border-color: #AAAAAA #999999 #777777; color: #333333; } .fukidashi p.l.line:before { position: absolute; top: -1px; left: -8px; z-index: 1; height: 0; width: 0; border-style: solid none none solid; border-width: 8px; border-color: #AAAAAA transparent; content: ""; } .fukidashi p.l.line:after { position: absolute; top: 0; left: -6px; z-index: 3; height: 0; width: 0; border-style: solid none none solid; border-width: 8px; border-color: #F9F9F9 transparent; content: ""; } .fukidashi p.r.line { border-radius: 15px 0 15px 15px; /*box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.4), 0 10px 10px rgba(255, 255, 255, 0.5) inset, 0 -10px 10px rgba(0, 0, 0, 0.1) inset;*/ position: relative; z-index: 2; padding: 6px 12px; background-color: #BBFF77; border-style: solid; border-width: 1px; border-color: #AAAAAA #999999 #777777; color: #333333; } .fukidashi p.r.line:before { position: absolute; top: -1px; right: -8px; z-index: 1; height: 0; width: 0; border-style: solid solid none none; border-width: 8px; border-color: #AAAAAA transparent; content: ""; } .fukidashi p.r.line:after { position: absolute; top: 0; right: -6px; z-index: 3; height: 0; width: 0; border-style: solid solid none none; border-width: 8px; border-color: #CCFF88 transparent; content: ""; } /**Facebook風;**/ .fukidashi p.l.fb { position: relative; padding: 5px 10px; z-index: 2; background-color: #EEEEEE; border-style: solid; border-width: 1px; border-color: #EEEEEE; border-radius: 4px; color: #333333; } .fukidashi p.l.fb:before { position: absolute; top: 7px; left: -6px; z-index: 1; height: 0; width: 0; border-style: solid solid solid none; border-width: 6px; border-color: transparent #EEEEEE; content: ""; } .fukidashi p.l.fb:after { position: absolute; top: 7px; left: -5px; z-index: 3; height: 0; width: 0; border-style: solid solid solid none; border-width: 6px; border-color: transparent #EEEEEE; content: ""; } .fukidashi p.r.fb { color: #fff; position: relative; padding: 5px 10px; z-index: 2; background-color: #5555FF; border-style: solid; border-width: 1px; border-color: #5555FF; border-radius: 4px; } .fukidashi p.r.fb:before { position: absolute; top: 7px; right: -6px; z-index: 1; height: 0; width: 0; border-style: solid none solid solid; border-width: 6px; border-color: transparent #5555FF; content: ""; } .fukidashi p.r.fb:after { position: absolute; top: 7px; right: -5px; z-index: 3; height: 0; width: 0; border-style: solid none solid solid; border-width: 6px; border-color: transparent #5555FF; content: ""; } /* フォントカラー */ .fukidashi p.color_red { color: #DB1114;} .fukidashi p.color_blue { color: #173FC0;} .fukidashi p.color_green { color: #43BF46;} /* フォントサイズ */ .fukidashi p.size_s { font-size: 80%;} .fukidashi p.size_m { font-size: 100%;} .fukidashi p.size_l { font-size: 130%;} /* フォント太さ */ .fukidashi p.weight_n { font-weight: normal;} .fukidashi p.weight_b { font-weight: bold;} /* 背景色 */ .fukidashi p.bg_red { background: #F3D7D7 !important;} .fukidashi p.bg_blue { background: #8DA8E0 !important;} .fukidashi p.bg_blue.l.think:before { background: #8DA8E0 !important;} .fukidashi p.bg_blue.l.think:after { background: #8DA8E0 !important;} .fukidashi p.bg_blue.l.line:before { border-color: #aaa transparent !important;} .fukidashi p.bg_blue.l.line:after { border-color: #c5d3ef transparent !important;} .fukidashi p.bg_blue.l.fb:before { border-color: transparent #EEEEEE !important;} .fukidashi p.bg_blue.l.fb:after { border-color: transparent #8DA8E0 !important;} .fukidashi p.bg_green { background: #B7F0C1 !important;} /***** 店舗情報引用 *****/ #shop_quote { margin: 50px auto 15px; width: 570px; } #shop_quote table { margin: 0 auto 20px; width: 100%; } #shop_quote tr { border-bottom: 1px dotted #574334; text-align: left; } #shop_quote tr:last-of-type { border-bottom: none; } #shop_quote td { padding: 3px 0; } #shop_quote td pre { color: #333; font-family: "Hiragino Kaku Gothic W3 JIS2004", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "MS Pゴシック", "MS PGothic", sans-serif; font-size: 14px; font-size: 1.4rem; } #shop_quote #map_canvas { margin: auto; } #shop_quote td.sp-tel a { text-decoration: underline; } /* スクロールメニュー */ #scroll-menu { display: none; } /* 360 View */ /* #bloc-360 { background: #fff; margin: 20px 0 0; padding: 15px; } #bloc-360 h2 { background: url(../img/ttl_bloc-360.png) no-repeat left center; border-bottom: 1px solid #a4a899; font-family: "Reimin Heavy"; font-size: 18px; font-size: 1.8rem; line-height: 47px; margin: 0 0 20px; padding: 0 0 0 50px; } #bloc-360 h3 { font-family: "Reimin Heavy"; margin: 10px 0; } #bloc-360 .curator { margin: 0; } */ /* instagram */ /* #bloc-insta { background: #fff; margin: 20px 0 0; padding: 15px 15px; } #bloc-insta h2 { border-bottom: 1px solid #a4a899; margin: 0 0 20px; } #bloc-insta ul { padding: 0 10px; } #bloc-insta li { display: inline-block; margin: 0 10px 10px; } */ /* 人気記事ランキング */ #bloc-ranking { background: #fff; padding: 20px 15px; } #bloc-ranking h2 { /*background: url(../img/ttl_bloc-ranking.png) no-repeat left center;*/ border-bottom: 1px solid #a4a899; /*font-family: "Reimin Heavy";*/ /*font-size: 16px;*/ /*font-size: 1.6rem;*/ /*line-height: 34px;*/ margin: 0 0 20px; /*padding: 0 0 0 35px;*/ } #bloc-ranking li { position: relative; padding: 5px 5px 0; } #bloc-ranking li:not(:first-of-type) { margin: 20px 0 0; } #bloc-ranking div.mcol:before { content: " "; height: 17px; width: 13px; position: absolute; left: 5px; top: 5px; } #bloc-ranking li:first-of-type div.mcol:before { background: url(../img/icon_ranking1.png);} #bloc-ranking li:nth-of-type(2) div.mcol:before { background: url(../img/icon_ranking2.png);} #bloc-ranking li:nth-of-type(3) div.mcol:before { background: url(../img/icon_ranking3.png);} #bloc-ranking li:nth-of-type(4) div.mcol:before { background: url(../img/icon_ranking4.png);} #bloc-ranking li:nth-of-type(5) div.mcol:before { background: url(../img/icon_ranking5.png);} #bloc-ranking .info { font-size: 12px; font-size: 1.2rem; padding: 0 0 0 5px; width: -webkit-calc(100% - 63px); width: calc(100% - 63px); } #bloc-ranking .wpp_tab { border-bottom: 2px solid #e6e6e6; margin: 20px 0 0; overflow: hidden; } #bloc-ranking .wpp_tab li { border-bottom: none; cursor: pointer; padding: 7px 12px; float: left; margin: 0 4px 0 0; text-align: center; width: 13%; } #bloc-ranking .wpp_tab>li.select { background: #f9f2e4; } #bloc-ranking .wpp_tab>li.select:hover { background: #f9f2e4; } #bloc-ranking .wpp_tab li:hover { background: #f9f8f6; } #bloc-ranking .wpp_content li { padding: 20px 0; } #bloc-ranking .wpp_hide { display: none; } /* ピックアップ記事 */ #bloc-pickupentry { background: #fff; margin: 20px 0 0; padding: 20px 15px; } #bloc-pickupentry h2 { /*background: url(../img/ttl_bloc-ranking.png) no-repeat left center;*/ border-bottom: 1px solid #a4a899; /*font-family: "Reimin Heavy";*/ /*font-size: 16px;*/ /*font-size: 1.6rem;*/ /*line-height: 34px;*/ margin: 0 0 20px; /*padding: 0 0 0 35px;*/ } #bloc-pickupentry li { position: relative; padding: 5px 5px 0; } #bloc-pickupentry li:not(:first-of-type) { margin: 20px 0 0; } #bloc-pickupentry .info { font-size: 12px; font-size: 1.2rem; padding: 0 0 0 5px; width: -webkit-calc(100% - 63px); width: calc(100% - 63px); } /* ********************************************************************************** category カテゴリー別 ********************************************************************************** */ .category #bloc-entrylist header { border-bottom: 12px solid #f7ede3; margin: 0 0 1.5rem 0; } /* .author #bloc-entrylist header { */ /*background: url(../img/img_curator02_l.png) no-repeat;*/ /*padding: 0 0 0 15.0rem;*/ /* } */ .category #bloc-entrylist header h2 { border: none; } .category #bloc-entrylist header p { font-weight: bold; } .category #bloc-entrylist header ul { margin: 0 0 1.0rem; } .category #bloc-entrylist header li { display: inline-block; margin: 0 .5rem 0 0; } .category #bloc-entrylist header li img { height: auto; width: 90%; } /* ランキング */ #page-ranking .wpp-list { counter-reset: wpp-ranking; } #page-ranking .wpp-list li { border-bottom: 2px dotted #e6e6e6; display: table; font-size: 19px; font-size: 1.9rem; font-weight: bold; position: relative; list-style-type: none; padding: 10px 0 5px 5px; width: 100%; } #page-ranking .wpp-list li a { display: table-cell; vertical-align: middle; } #page-ranking .wpp-list li a:nth-of-type(1) { padding: 0 0 0 50px; width: 70px; } #page-ranking .wpp-list li a:nth-of-type(2) { padding: 0 0 0 15px; } #page-ranking .wpp-list li:before { border-radius: 20px; content: counter(wpp-ranking, decimal); counter-increment: wpp-ranking; background: rgb(158, 158, 158); color: #fff; font-size: 14px; line-height: 1; padding: 10.5px 0; position: absolute; left: 0; text-align: center; top: -webkit-calc(50% - 15px); top: calc(50% - 15px); width: 35px; z-index: 1; } #page-ranking .wpp-list li:nth-child(1):before { background: url(../img/icon_ranking-gold.gif) no-repeat; background-size: 35px; border-radius: 0; } #page-ranking .wpp-list li:nth-child(2):before { background: url(../img/icon_ranking-silver.gif) no-repeat; background-size: 35px; border-radius: 0; } #page-ranking .wpp-list li:nth-child(3):before { background: url(../img/icon_ranking-bronze.gif) no-repeat; background-size: 35px; border-radius: 0; } #page-ranking .tab { border-bottom: 2px solid #e6e6e6; margin: 20px 0 0; overflow: hidden; } #page-ranking .tab li { border-bottom: none; cursor: pointer; padding: 7px 12px; float: left; margin: 0 4px 0 0; text-align: center; } #page-ranking .tab>li.select { background: #f9f2e4; } #page-ranking .tab>li.select:hover { background: #f9f2e4; } #page-ranking .tab>li:hover { background: #f9f8f6; } #page-ranking .content li { padding: 20px 0; } #page-ranking .hide { display: none; } p.ranking_anchor { margin: 20px 0 0 0; text-align: right; } p.ranking_anchor a { text-decoration: underline; } p.ranking_anchor a:hover { text-decoration: none; } /* 検索結果 */ .search article { margin: 0 0 50px; } .search article:last-of-type { margin: 0 0 5px; } .search .navigation h2 { display: none; } .search .navigation .nav-links a:hover { text-decoration: underline; } .search .curator .thumbup { margin: 0; text-align: right; } .search .curator time, .search .curator .thumbup { -webkit-flex-basis: 50%; flex-basis: 50%; } /* イベント情報 */ .event_entrybloc { padding: 0 2rem 0; } /* .event_info h4 { font-size: 18px; font-size: 1.8rem; margin: 15px 0; line-height: 1.4; } .event_info table { position: relative } .event_info tr { border-bottom: 1px dashed #EEEEEE; } .event_info td { border: none; color: #dc7d42; padding: 4px 0 3px; } .event_info td a { color: #dc7d42; text-decoration: underline; } .event_info td a:hover { text-decoration: none; } .event_info th { border: none; background: none; padding: 4px 0 3px; text-align: left; vertical-align: top; width: 18%; } .event_entrybloc td p { margin: 0; } */ /* authors リポーター紹介 */ body.author { background-color: #DFFCF2; } body.authors{ background-color:#DFFCF2; } body.authors .header-entry{ margin: 0; } .author .bloc-entry { background: inherit; } body.authors .header-entry h1{ display: none; } /* ライター別一覧 */ #writer_profile { display: table; /* margin: 20px 0 30px; padding: 0 2.5rem; */ width: -webkit-calc(100% - 5.0rem); width: calc(100% - 5.0rem); } #writer_profile .writer_image { display: table-cell; vertical-align: middle; width: 96px; } #writer_profile .writer_image img { border: 2px dotted #f2ede1; border-radius: 60px; /* width: 96px; */ width: 120px; height: auto; } #writer_profile .writer_text { display: table-cell; padding: 0 40px 0 17px; vertical-align: middle; width: -webkit-calc(100% - 96px); width: calc(100% - 96px); } #writer_profile .writer_name { font-size: 24px; font-size: 2.4rem; font-weight: bold; line-height: 1.1; margin: 0; } #writer_profile .writer_name span { color: #666666; font-size: 14px; font-size: 1.4rem; } #writer_profile .writer_text .writer_description { margin: 12px 0 0; font-weight: normal; } .writers { display: flex; flex-wrap: wrap; } .writer-profile { box-sizing: border-box; margin: 0 0 6rem; padding: 0rem 1rem; width: 33%; } /* .writer-profile:not(:nth-of-type(3n+1)) { border-left: 1px dotted #a4a899; } */ .writer-profile .eyecatch { margin: auto; text-align: center; } .writer-profile .name { /* text-align: center; */ font-weight: bold; font-size: 20px; padding: 10px 0; margin: 0; } .writer-profile .description { /* font-size: 0.8em; */ font-size: 15px; line-height: 1.8; } .writer-profile .button a { margin: 20px auto; padding: 5px 0 5px; display: block; width: 80%; font-size: 14px; text-align: center; letter-spacing: 0px; color: #ffffff; border-radius: 25px; background: #1C1C1C 0% 0% no-repeat padding-box; } .writer-profile .button a:hover { text-decoration: none; } /* chekipon-henshubu 編集部コラム */ body.chekipon-henshubu{ background-color: #FFFFCC; } #event_over_check{ display: flex; justify-content: right; } #event_over_check p{ margin: 0 0 0 10px; font-size: 16px; font-weight: bold; } /* ********************************************************************************** 固定ページ ********************************************************************************** */ /* サイトマップ */ .sitemap { border-bottom: 1px dotted #828282; padding: 10px 0 10px 5px; margin-bottom: 12px; overflow: hidden; } .sitemap dt { display: block; float: left; font-size: 13px; font-weight: bold; width: 20%; } .sitemap dd { float: right; width: 75%; margin: 0; padding: 0 0 0 5%; } .sitemap dd ul { overflow: hidden; } .sitemap dd li { float: left; margin: 0 35px 6px 0; } .sitemap dd a:hover { text-decoration: underline; } /* recruit */ .recruit .info-entry h3 { background: url(../img/bg_ttl-recruit.gif) no-repeat; color: #333; font-size: 1.6rem; height: 5.8rem; line-height: 5.8rem; margin: 0; padding: 0 0 0 5.5rem; } .recruit .info-entry td.sp-tel a { text-decoration: underline; } /* inquiry */ .inquiry table { margin: 0 auto; width: 80%; } .inquiry table th, .inquiry table td { padding: 10px; } .inquiry table th { width: 30%; text-align: left; } .inquiry table td input, .inquiry table td textarea { width: 80%; } .inquiry table td .error { display: block; color: #f00; } .inquiry .btn { margin: 20px 0 0; text-align: center; } /* writerwanted */ .box__div--round-border { padding: 30px; background-color: #FFFFFF; border: 4px solid #1C1C1C; border-radius: 10px; } .box__div--round-bg-gray { padding: 20px 30px; background-color: #EEEEEE; border-radius: 10px; } .box__h--18 { margin: 0 !important; padding: 0 !important; color: #1C1C1C !important; font-size: 1.8rem !important; font-weight: bold !important; border-bottom: none !important; } .link__p--tel > a[href^="tel:"] { color: #1C1C1C; font-size: 1.8rem !important; font-weight: bold !important; } ul.is-style-checked { font-size: 15px; line-height: 1.8; } ul.is-style-checked li { list-style-type: none!important; padding-left: 30px; position: relative; } ul.is-style-checked li::before { background-size: cover; display: inline-block; position: absolute; top: 5px !important; left: 0 !important; margin-top: 0; width: 17px !important; height: 17px !important; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat; mask-image: url(/img/writerwanted/ic_check.svg); -webkit-mask-image: url(/img/writerwanted/ic_check.svg); } ul.list__ul--circle-b { margin-left: 1.5rem; font-size: 15px; line-height: 1.8; } ul.list__ul--circle-b li { position: relative; } ul.list__ul--circle-b li::before { content: "●"; position: absolute; left: -1.5rem; } .bloc-entry .btn__buttons--round-bk .wp-block-button__link { display: block; position: relative; width: 200px; margin-bottom: 0; padding: 16px; text-decoration: none; background: #1C1C1C; color: #FFFFFF; font-size: 1.4rem !important; font-weight: bold; text-align: center; border: none; border-radius: 23px; } .bloc-entry .btn__buttons--round-bk .wp-block-button__link:hover { color: #1C1C1C; background: #FFC72F; } body.writerwanted { background-color: #DFFCF2; } .writerwanted .bloc-entry { background: inherit; } .writerwanted .bloc-entry h2 { background-color: #FFFFFF; } [class^="wp-container"].card__columns--round-white { gap: 12px; } .card__columns--round-white .wp-block-column { padding: 30px 20px; background-color: #ffffff; border: 1px solid #000000; border-radius: 10px; } [class^="wp-container"].card__columns--num .wp-block-column { position: relative; } [class^="wp-container"].card__columns--num .wp-block-column::before { position: absolute; top: -1px; left: -1px; } [class^="wp-container"].card__columns--num .wp-block-column:nth-child(1)::before { content: url(/img/writerwanted/ic_repo01.svg); } [class^="wp-container"].card__columns--num .wp-block-column:nth-child(2)::before { content: url(/img/writerwanted/ic_repo02.svg); } [class^="wp-container"].card__columns--num .wp-block-column:nth-child(3)::before { content: url(/img/writerwanted/ic_repo03.svg); } .card__columns--round-white h3 { margin: 0 0 10px; padding: 0; color: #1C1C1C !important; font-size: 1.8rem; font-weight: bold; border-bottom: none; } .card__columns--round-white p { margin: 0; } p.writerwanted__p--b-bg-black > strong { margin-right: 20px; padding: 8px; color: #ffffff; background-color: #000000; } body.writerwanted .page-header{ background-image: url(../img/header/tl_main_b_pc.png); } /* infooffer 情報提供 */ .mw_wp_form.mw_wp_form_input .mwf__item--display-confirm { display: none; } .mw_wp_form.mw_wp_form_confirm .mwf__item--display-input { display: none; } .mw_wp_form .mwf__div--wrapper { width: 100%; padding: 40px; font-family: 'Noto Sans JP', sans-serif; background-color: #EEEEEE; border-radius: 10px; box-sizing: border-box; } .mw_wp_form dl.mwf__dl--input-part { margin: 0; font-family: 'Noto Sans JP', sans-serif; } .mw_wp_form dl.mwf__dl--input-part dt { margin-bottom: 10px; font-size: 1.5rem; font-weight: bold; } .mw_wp_form dl.mwf__dl--input-part dd { margin-bottom: 20px; margin-left: 0; } .mw_wp_form dl.mwf__dl--input-part dd:last-child { margin-bottom: 0; } .mw_wp_form .mwf__select--area { position: relative; width: fit-content; margin: 0; padding: 0; } .mw_wp_form .mwf__select--area::after { pointer-events: none; position: absolute; color: #1C1C1C; top: 50%; right: 20px; transform: translateY(-50%); content: "▼"; } .mw_wp_form.form_confirm .mwf__select--area::after, .mw_wp_form.mw_wp_form_preview .mwf__select--area::after { display: none; } .mw_wp_form select.mwf__select--round-bk { width: 50%; min-width: fit-content; padding: 20px 50px 20px 20px; font-weight: bold; background-color: #ffffff; border: 2px solid #1C1C1C; border-radius: 6px; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .mw_wp_form input[type="text"].mwf__input--round-bk, .mw_wp_form input[type="email"].mwf__input--round-bk, .mw_wp_form textarea.mwf__textarea--round-bk { width: 100%; padding: 20px; background-color: #ffffff; border: 2px solid #1C1C1C; border-radius: 6px; box-sizing: border-box; } .mw_wp_form .mwform-tel-field { font-family: 'Noto Sans JP', sans-serif; font-weight: bold; } .mw_wp_form .mwform-tel-field input[type="text"].mwf__input--round-bk { max-width: 100px; margin-right: 10px; margin-left: 10px; } .mw_wp_form .mwform-tel-field input[type="text"].mwf__input--round-bk:first-of-type { margin-left: 0; } .mw_wp_form .mwform-tel-field input[type="text"].mwf__input--round-bk:last-of-type { margin-right: 0; } .mw_wp_form .mwf__span--note { color: #666666; font-family: 'Noto Sans JP', sans-serif; font-size: 1.5rem; font-weight: 400; } .mw_wp_form .mwf__submit--area { margin: 40px auto; text-align: center; } .mw_wp_form input[type="submit"].mwf__btn--round-bk { padding: 15px 47px; color: #ffffff; font-family: 'Noto Sans JP', sans-serif; font-size: 1.8rem; font-weight: 400; background-color: #1C1C1C; border: none; border-radius: 28px; transition: all 0.5s ease; } .mw_wp_form input[type="submit"].mwf__btn--round-bk:hover { color: #1C1C1C; background-color: #FFC72F; } /* overview フリーマガジンチェキポン */ .bloc-entry .wp-block-table.overview__table--horizon-th-gray table { border-top: 2px solid #1C1C1C; border-bottom: 2px solid #1C1C1C; } .bloc-entry .wp-block-table.overview__table--horizon-th-gray table th { padding: 20px; width: auto; min-width: 160px; font-weight: bold; text-align: left; background-color: #EEEEEE; border: dashed #1C1C1C; border-width: 1px 1px 1px 0; } .bloc-entry .wp-block-table.overview__table--horizon-th-gray table td { padding: 20px; width: auto; text-align: left; line-height: 1.8; background-color: #ffffff; border: dashed #1C1C1C; border-width: 1px 0 1px 0; } /* not found */ .category #bloc-entrylist .not-found header { border-bottom: none; margin: 0 0 3rem 0; position: relative; } .category #bloc-entrylist .not-found #icon_not_found { position: absolute; right: 32px; top: -29px; } .category #bloc-entrylist .not-found #icon_not_found img { width: 155px; } .category #bloc-entrylist .not-found #search { margin: 0 0 9px; position: relative; width: 320px; } .category #bloc-entrylist .not-found #search label { color: #dc7d42; display: inline-block; position: absolute; top: .2rem; left: 1rem; } .category #bloc-entrylist .not-found #search input { border-color: #dc7d42; border-radius: 5px; border-style: solid; border-width: 1px; padding: 0 0 0 2rem; width: 215px; } .category #bloc-entrylist .not-found #search button { background: #dc7d42; border: none; /*border-radius: 5px;*/ color: #fff; margin: 0 0 0 .5rem; padding: .1rem 1rem; } .category #bloc-entrylist .not-found #search button:first-letter { letter-spacing: 1rem; } @media (min-width: 769px) { /***** ドロワー *****/ #drawer-waypoint, .drawer-nav, #drawer-label01 { display: none; } } /* 占い */ html.pum-open.pum-open-overlay, html.pum-open.pum-open-overlay.pum-open-fixed .pum-overlay { overflow-y: scroll !important; overflow-x: hidden; } div.pum-overlay { -ms-overflow-style: none; scrollbar-width: none; } div.pum-overlay::-webkit-scrollbar { display: none; } html.pum-open.pum-open-overlay.pum-open-scrollable body>[aria-hidden] { padding-right: 0px !important; } body.horoscope { background-color: #FFFFCC; } .horoscope .bloc-entry { background: inherit; } .horoscope__p--title-date { position: relative; margin: 30px auto; color: #4E3100; font-size: 1.8rem !important; font-weight: bold; } .horoscope__p--title-date::before { position: absolute; content: ""; display: block; width: 190px; height: 40px; top: -30px; left: 0; right: 0; margin: 0 auto; background-image: url(/img/horoscope/im_oneeuranai.svg); background-position: top center; background-size: contain; background-repeat: no-repeat; } .horoscope__p--title-date > strong { color: #ffffff; font-family: 'Poppins'; font-size: 4rem; font-weight: bold; -webkit-text-stroke: 1px #4E3100; text-stroke: 1px #4E3100; } .horoscope__section--zodiac { column-gap : 18px !important; row-gap : 20px !important; } .horoscope__group--btn { width: auto; max-width: 156px; height: auto; padding: 20px; background-color: #ffffff; border: 2px solid #FFC72F; border-radius: 10px; box-shadow: 4px 4px #ffc72f; } h3.horoscope__h3--zodiac { color: #4E3100 !important; margin: 10px auto; padding-bottom: 0; font-size: 1.8rem; font-weight: bold; border-bottom: 0; } p.horoscope__p--zodiac-date { margin: 0; color: #666666; font-size: 1.3rem; } .box__div--horizontal-dot { padding: 20px 0; border-top: 1px #666666 dotted; border-bottom: 1px #666666 dotted; } #horoscope-element h2.horoscope__h2--element { margin: 0; padding: 0; color: #4E3100; font-size: 1.6rem; font-weight: bold; background-color: inherit; border-radius: inherit; } #horoscope-element p { margin: 5px 0; color: #4E3100; font-size: 1.4rem; font-weight: bold; } #horoscope-element p strong { margin-right: 5px; padding: 2px 4px; color: #FFF8D1; background-color: #4E3100; } .wp-block-columns.horoscope__columns--element { margin-bottom: 0; } .author__div--round-yellow { /* padding: 10px; */ background-color: #ffffff; border: 4px solid #FFC72F; border-radius: 10px; } .author__div--round-yellow .wp-container-71 figure{ margin-bottom: 0; } .author__div--round-yellow p.author__p--position { margin: 0; margin: 0; color: #4E3100; font-size: 1.4rem; } .author__div--round-yellow h2.author__h2--name { margin: 0 0 8px; padding: 0; color: #4E3100; font-size: 1.8rem; font-weight: bold; background-color: inherit; border-radius: 0; } .author__div--round-yellow p.author__p--about { margin: 0; color: #4E3100; font-size: 1.4rem; } .pum-theme-51282 .pum-container, .pum-theme-lightbox .pum-container{ padding: 20px !important; } .popup__columns--title-horoscope { gap: 0 !important; margin-left: -20px; margin-bottom: 22px; } h2.popup__h2--zodiac { margin: 0px; color: #1C1C1C; font-size: 2.8rem; font-weight: bold; } p.popup__p--zodiac-date { margin: 0; color: #666666; font-size: 1.4rem; } h3.popup__h3--horoscope { position: relative; padding: 19px 0 19px 95px; color: #1C1C1C; font-size: 1.8rem; font-weight: bold; background-color: #FFC72F; border-radius: 8px; } h3.popup__h3--horoscope::before { content: ""; display: block; position:absolute; top:0; bottom:0; left: 0; width: 80px; height: 80px; background: url(/img/horoscope/ic_onee@2x.png) no-repeat; background-size: contain; } h3.popup__h3--horoscope { position: relative; margin: 0 0 32px 40px; padding: 19px 0 19px 55px; color: #1C1C1C; font-size: 1.8rem; font-weight: bold; background-color: #FFC72F; border-radius: 8px; } h3.popup__h3--horoscope::before { content: ""; display: block; position: absolute; top: -5px; bottom: -5px; left: -40px; width: 80px; height: 80px; background: url(/img/horoscope/ic_onee@2x.png); background-repeat: no-repeat; background-size: contain; } p.popup__p--horoscope { color: #666666; font-size: 1.5rem; } p.popup__p--fortune { color: #1C1C1C; font-size: 1.5rem; } p.popup__p--fortune strong { font-weight: bold; } /* */ [class^="wp-container"].area__group--sns { gap: 30px; } /* ********************************************************************************** max 1100px ********************************************************************************** */ @media (max-width: 1100px) { #main-header .wrapper{ padding-top: 1.6rem; display: block; } .top #main-header .wrapper{ padding-top: 0; } .wrapper, #wrapper-main, #wrapper-footer footer{ width: 100%; } /* ヘッダー */ #main-header{ border-top: 6px solid #FABE3A; } #main-header h1{ padding-left: 26px; height: calc(100vw * (177 / 680)); min-height: 160px; } #main-header h1 img{ width: 38%; min-width: 184px; } #main-header .sns{ display: none; } #main-header .right{ position: relative; align-items: flex-start; padding-left: 4%; } #main-header nav#g_nav{ padding-bottom: 8px; width: 92%; overflow-x: scroll; display: none; } #main-header nav#g_nav::-webkit-scrollbar-thumb { box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3); } #main-header.is-fixed .wrapper{ padding:14px 0 0; } #main-header.is-fixed nav#g_nav{ display: block; } #main-header.is-fixed h1{ padding-left: 0; text-align: center; } #main-header.is-fixed .wrapper, #main-header.is-fixed h1{ height: auto; } #main-header.is-fixed h1 img{ height: 48px; } #main-header #g_nav li:not(:first-child) { margin: 0 0 0 3rem; } #main-header #g_nav li a span{ line-height: 1; } #main-header nav#g_nav ul{ width: 850px; } .breadcrumb-area{ margin-bottom: 0; padding: 0 4%; } .breadcrumb-area a,.breadcrumb-area span{ font-size: 12px; color: #888888; } .breadcrumb-area img{ width: auto; } #main-header.is-fixed + #wrapper-main{ padding-top: 140px; } /* フッター */ .page_top{ width: 90px; left: initial; right: 4%; } footer{ padding-top: 0; } footer .wrapper{ padding: 30px 4%; box-sizing: border-box; } footer .footer_logo{ width: 28%; } footer .footer_logo img{ width: 100%; min-width: 177px; } footer .right{ background-size: 240%; } footer .nav_footer ul{ margin: auto; flex-wrap: wrap; } footer .nav_footer ul li{ margin-bottom: 10px; } footer .nav_footer ul li:not(:first-child){ padding-left: 0; } footer .nav_footer ul li:not(:last-child){ margin-right: 8px; padding-right: 8px; } footer .nav_footer ul li a{ font-size: 14px; } footer .bnr_page ul{ flex-wrap: wrap; } footer .bnr_page ul li{ width: 46%; margin: 0 auto 10px; } footer .bnr_page ul li:not(:first-child){ margin: 0 auto 10px; } /* サイドカラム */ .bnr_area li{ margin: 0 auto 20px; width: 90%; } .magazine{ padding: 0 4% 24px; justify-content: space-evenly; } .magazine h3{ width: 100%; } .from_editors h3 { margin: -44px auto 10px; width: 50vw; text-align: center; } .black_bg{ position: fixed; top: 0; left: 0; z-index: 8888; background-color: rgba(0, 0, 0, 0.5); width: 100vw; height: 100vh; } .btn_search_open{ position: fixed; bottom: 20px; right: 2%; width: 58px; height: 58px; z-index: 8888; } #search{ padding-top: 40px; position: fixed; bottom: -120%; left: 0; z-index: 9998; width: 100%; background-color: #ffc72f; transition: all 0.5s ease; } #search.open{ bottom: 0; } #search .btn_search_close{ display: block; width: 58px; height: 58px; position: absolute; bottom: 20px; right: 2%; z-index: 9999; } #search form{ background-image: none; } /* トップページ */ #bloc-entrylist h2{ width: 92%; margin: 0 auto 12px; } #top_announce{ padding: 34px 10%; } #bloc-entrylist #new_topics h2 img{ width: 60vw; max-width: 100%; } #new_topics ul{ width: 94%; margin: 0 auto 16px; } #new_topics ul li{ width: 43.5vw; overflow: visible; } #new_topics ul li img{ width: 100%; height: 44vw; } #new_topics .cat{ font-size: 12px; } .new_topics_text{ padding: 13px 7px 12px 12px; background: no-repeat; border-left: 1px solid #1c1c1c; border-bottom: 1px solid #1c1c1c; border-bottom-left-radius: 10px; /* height: 6em; */ } .new_topics_text::after { content: ""; width: 5px; height: 5px; display: block; position: absolute; bottom: -4px; right: 0; background: #ffffff; border-radius: 100%; border: 1px solid #1c1c1c; } .bloc-entry .image-main{ margin-bottom: 40px; } #bloc-entrylist #tourisum h2 img{ margin-left: -16px; } #tourisum{ padding-right: 4%; } #tourisum h2{ width: 18%; display: inline-block; } #tourisum .flex{ margin-bottom: 20px; } #tourisum .first_post{ margin-right: 0; margin-bottom: 20px; padding-top: 20px; width: 77%; } #tourisum .first_post .tourisum_info{ margin-top: 18px; font-size: 18px; } #tourisum .other_post { display: flex; justify-content: space-between; width: 100%; padding-left: 4%; } #tourisum .other_post .tourisum_info{ margin-top: 6px; } #tourisum .other_post a{ width: 48%; box-sizing: border-box; } #bloc-entrylist #event h2{ margin-bottom: 0; } #bloc-entrylist #event h2 img{ width: 100%; } #event .event_slider{ padding-top: 40px; } #event .event_slider .next-arrow{ right: -100%; /* right: 4%; */ } #event .event_slider .prev-arrow{ right: -100%; /* right: calc(50px + 4%); */ } #bloc-entrylist #pickup h2 img{ width: 100%; } #pickup ul{ padding: 0 4%; } #pickup ul li{ margin-bottom: 30px; padding: 0; width: 47%; } #pickup ul li img{ width: 40vw; height: 40vw; } #pickup ul li .cat{ font-size: 11px; } #area{ margin-bottom: 60px; padding: 84px 0 60px; } #area h2{ margin: -100px auto 14px; display: block; position: initial; left: initial; text-align: center; } #area .area_map{ display: none; } #area .flex{ display: block; } #area .area_list{ margin: auto; width: 80%; } #bloc-right .ranking ol .mcol{ display: block; } #bloc-right .ranking .photo img{ margin: auto; width: 100%; min-width: 110px; height: auto; } .tag_cloud,.side_ad_area{ padding: 0 4%; } /* 記事一覧 */ .page-header{ margin: 24px auto 0; width: 92%; background: url(../img/header/tl_main_y_sp.png) no-repeat center / 100%; border-radius: 10px; } .page-header h2.tag_title img{ width: 80%; } .page-header h2.tag_title span{ font-size: 24px; } body.horoscope .page-header, body.chekipon-henshubu .page-header, body.writerwanted .page-header, body.authors .page-header{ background-image: url(../img/header/tl_main_b_sp.png); } #bloc-entrylist article{ margin-bottom: 30px; padding-bottom: 30px; } #bloc-entrylist article .photo, #bloc-entrylist article .photo a{ width: 120px; height: 120px; } #bloc-entrylist .info{ margin-left: 20px; width: 100%; } #bloc-entrylist .info .area_list{ margin: 8px 0 6px; padding: 0; justify-content: left; } #bloc-entrylist .info h3{ margin-top: 6px; font-size: 17px; line-height: 1.5; } #bloc-entrylist .info p{ display: none; } #bloc-entrylist .info p.spot_open, #bloc-entrylist .info p.event_period{ display: block; line-height: 1.5; font-size: 16px; } /* 記事詳細ページメインカラム */ #wrapper-main{ margin-top: -4vw; } body:not(.top) #column-two{ margin-top: 40px; padding: 0 4%; } .bloc-entry, .bloc-comment{ margin-bottom: 20px; } .header-entry h1{ margin-top: 0; font-size: 21px; line-height: 1.5; } .bloc-entry .event_period{ margin-bottom: 0; } .bloc-entry .area_list li{ font-size: 14px; } .bloc-entry .image-main img{ width: 100%; height: auto; } .info-entry.close, .event_info.close{ /* height: 82px; */ padding-bottom: 60px; height: auto; max-height:initial } .info-entry, .event_info{ padding: 20px; } .bloc-entry .event_info h4{ margin-bottom: 0; } .info-entry h3, .event_info h3{ padding-bottom: 10px; } .info-entry table, .event_info table{ width: 100%; } .info-entry dl, .info-entry table tr, .event_info table tr{ padding: 10px 0; display: block; } .info-entry dl dt, .info-entry table th, .event_info table th{ padding-bottom: 0px; display: block; width: 100%; } .info-entry dl dd, .info-entry table td, .event_info table td{ width: auto; margin-left: 0; } .bloc-entry .ulike_wrapp img{ width: 1.2em; } .bloc-entry .curator{ padding: 15px ; } .bloc-entry .curator .ulike_wrapp p { margin: 0 20px 0 0; font-size: 13px; } .bloc-entry .curator .curator_profile a.thum{ margin-right: 10px; /* width: 100%; */ flex-basis: 30%; } .bloc-entry .curator .curator_profile a.thum img{ width: 100%; /* max-width: 200px; */ height: auto; } .bloc-entry .curator .curator_profile div{ flex-basis: 70%; } .bloc-entry .curator .curator_profile .writer_description{ font-size: 14px; line-height: 1.8; } .info-entry .info_close, .event_info .info_close{ margin-top: 10px; } .bloc-comment form p input, .bloc-comment form p textarea{ margin-bottom: 20px; width: 94%; } .bloc-comment form{ padding: 20px; } /* 固定ページ */ .writers .eyecatch img{ height: auto; } .writer-profile { margin-bottom: 30px; width: 50%; } .mw_wp_form .mwf__div--wrapper{ padding: 24px 20px; } .mw_wp_form .mwform-tel-field input[type="text"].mwf__input--round-bk{ width: 24%; } .mw_wp_form .mwf__select--area{ width: auto; } .bloc-entry .wp-block-table.overview__table--horizon-th-gray table th{ min-width: 5em;; } .mw_wp_form select.mwf__select--round-bk { width: 100%; } .wp-block-buttons.is-content-justification-right{ justify-content: center; } } /* ********************************************************************************** max 768px ********************************************************************************** */ @media (max-width: 768px) { body { font-size: 16px; font-size: 1.6rem; } .curator { margin: 10px 3.5rem; } .bloc-entry hr { width: 90%; } #column-two { display: block; } #bloc-left { width: 100%; } /* .header-entry h1 { padding: 0 0 5px; } */ #bloc-right { margin: auto; width: 100%; max-width: 520px; text-align: center; } #logo-header, #wrapper-main, #wrapper-footer footer { margin: 0 auto; width: 96%; } .top #wrapper-main{ width: 100%; } #main-header{ margin-bottom: -10px; } #logo-header h1 { margin: 0; } #logo-header #sns-header { position: relative; left: 0; top: 0; width: 100%; } #sns-header ul { text-align: center; } #sns-header ul li { margin: 0 1.0rem; } #logo-header #search label { display: none; } #logo-header #search input { padding: .5rem 1rem; } #logo-header #search button { padding: .5rem 1rem; } .pure-toggle-label { display: block; } #nav-global { display: none; } #bloc-right .ranking{ margin: auto; width: 92%; } #bloc-right .ranking h2 img{ width: 100%; } #bloc-right .ranking ol .mcol{ display: flex; } #bloc-new .photo { height: 360px; max-width: 86%; width: auto; } #bloc-new .photo img { width: 100%; } #bloc-new .curator { border-bottom: 3px solid #e6e6e6; } #bloc-new .curator .thumbup { margin: -13px 0 0; text-align: right; } #bloc-new .info { font-size: 19px; font-size: 1.9rem; width: 640px; margin: auto; } #bloc-new .cattag { width: 640px; margin: 1.0rem auto; } #bloc-new>ul { flex-wrap: wrap; } #bloc-new>ul>li { -webkit-flex-basis: 100%; flex-basis: 100%; margin: 0 0 35px; } #bloc-new .icon { height: 55px; top: 0; left: 26px; } #bloc-new .icon img { width: 112px; } #bloc-banner img { width: 100%; } #bloc-ranking h2 img, #bloc-pickupentry h2 img, #bloc-insta h2 img { width: auto; } #nav-footer ul { padding: 0 3rem; text-align: center; } #search-footer { line-height: 2; margin: 18px 0 0; text-align: center; } /*トップページ */ #top_slider{ height: calc(100vw * (512 / 760)); margin-bottom:calc(100vw * (80 / 760)) !important; } #top_slider .slider li img.slide_image{ width: 100%; height: calc(100vw * (218/376)); } #top_slider .slider li img.slide_deco{ width: 100%; height: auto; top: calc(100vw * -0.3); left: calc(100vw * (-52 / 376)); } #top_slider .slide_info{ padding-top: 10px; top: calc(100vw * (190/376)); left: 2rem; } #top_slider .slide_title{ width: calc(100vw * 0.76); margin: 0 0 4px; padding-bottom: 4px; } #top_slider .slick-list{ height: auto; overflow: visible; } #top_slider .slick-dots { bottom: -56px; left: 16px; } #main-header .right::after{ content: ""; position: absolute; top: 0; right: 2%; display: block; width: 15px; height: 30px; background: url(../img/ar_right.svg/) no-repeat center / 100%; } /***** 下層ページ *****/ .bloc-entry .image-main { width: 100%; } .bloc-entry .image-main { width: 100%; } .bloc-entry .body-entry { margin: 0 0 20px; width: 100%; } /* .bloc-entry .body-entry img { width: 100%; } */ .bloc-entry .image-main img { width: 100%; } .bloc-entry .curator { background-color: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 0 auto; width: 100%; } .bloc-entry .info-entry-simple table td.sp-tel span { display: none; } .bloc-comment form { margin: 25px auto; width: 100%; } .bloc-comment form li label { padding: 0 0 20px 25px; text-align: left; width: 30%; } .bloc-comment form li input { width: 70%; } .bloc-comment form li textarea { width: 88%; } .bloc-comment .btn button { margin: 8px 0 0; width: 40%; } .bloc-comment .reply p { border-bottom: 1px dotted #aaa; padding: 0 0 20px; } #bloc-ranking .info { font-size: 15px; font-size: 1.5rem; } #bloc-ranking>ol { overflow: hidden; } #bloc-ranking>ol li { border-right: 1px solid #aaa; float: left; margin: 0 15px 18px 0; padding: 0 15px 0 0; width: -webkit-calc((100% - 31px) / 2); width: calc((100% - 31px) / 2); } #bloc-ranking li:not(:first-of-type) { margin: 0 15px 18px 0; } #bloc-ranking li:nth-of-type(2n) { border-right: none; margin: 0; padding: 0 0 18px 0; } #bloc-ranking .mcol { display: block; width: 100%; } #bloc-ranking .mcol .photo { display: table-cell; width: 63px; } #bloc-ranking .mcol .info { display: table-cell; width: -webkit-calc(100% - 68px); width: calc(100% - 74px); vertical-align: top; } #bloc-pickupentry .info { font-size: 15px; font-size: 1.5rem; } #bloc-pickupentry>ul { overflow: hidden; } #bloc-pickupentry>ul li { border-right: 1px solid #aaa; float: left; margin: 0 15px 18px 0; padding: 0 15px 0 0; width: -webkit-calc((100% - 31px) / 2); width: calc((100% - 31px) / 2); } #bloc-pickupentry li:not(:first-of-type) { margin: 0 15px 18px 0; } #bloc-pickupentry li:nth-of-type(2n) { border-right: none; margin: 0; padding: 0 0 18px 0; } #bloc-pickupentry .mcol { display: block; width: 100%; } #bloc-pickupentry .mcol .photo { display: table-cell; width: 63px; } #bloc-pickupentry .mcol .info { display: table-cell; width: -webkit-calc(100% - 68px); width: calc(100% - 74px); vertical-align: top; } #bloc-banner ul { overflow: hidden; } #bloc-banner li { float: left; margin: 20px 5px 0 0; width: -webkit-calc((100% - 10px) / 3); width: calc((100% - 10px) / 3); } #bloc-banner li:nth-of-type(3n) { margin: 20px 0 0; } .info-entry th, .info-entry td { font-size: 15px; font-size: 1.5rem; padding: 2rem 8px; } .gallery-entry figure:nth-of-type(n+4) { margin: 3.0rem 0 0; } .gallery-entry figure figcaption { font-size: 1.5rem; margin: 0 auto; width: 80%; } .share-icons { margin: 5px 0 0; } .share-icons .fb_iframe_widget, .share-icons .twitter-share-button { vertical-align: bottom; } /***** ランキング *****/ #page-ranking .tab li { padding: 12px 15px; } /***** ドロワー *****/ #drawer-waypoint { border-bottom: 2px solid #E6E6E6; opacity: 0; position: fixed; visibility: hidden; width: 100%; transition: .5s; } #drawer-waypoint.scroll { background: #fff; padding: 17px 0 10px; position: fixed; width: 100%; z-index: 5; transition: .5s; visibility: visible; width: 100%; opacity: 1; } #drawer-waypoint p { margin: 0; text-align: center; display: inline-block; width: -webkit-calc((100% - 126px)); width: calc((100% - 126px)); vertical-align: top; } #drawer-waypoint p>a { margin: 0 0 0 -70px; } #drawer-waypoint p>a img { height: 30px; } #drawer-waypoint ul { display: inline-block; } #drawer-waypoint ul li { display: inline-block; line-height: 1; margin: 0 0 0 1.0rem; } #drawer-waypoint ul li img { vertical-align: text-bottom; width: 22px; } .drawer-nav>ul:first-of-type { padding: 81px 10px 0; } .drawer-nav>ul>li { border-top: 1px solid #A4A899; margin: 0; } .drawer-nav>ul>li:last-child { border-bottom: 1px solid #A4A899; } .drawer-nav li dl { margin: 0; } .drawer-nav li a { display: inline-block; font-size: 14px; font-size: 1.4rem; padding: 16px 0 16px 20px; position: relative; text-decoration: none; width: 100%; } .drawer-nav #sidemenu dd.contentWrap ul li a:before { content: ""; display: inline-block; border-style: solid; border-width: 3px 0 3px 6px; border-color: transparent transparent transparent #DCBE78; margin: 0 5px 2px 0; } .drawer-nav .displayNone { display: none; margin: 0; } .drawer-nav .accordion { margin: 0 0 10px; padding: 10px; border: 1px solid #ccc; } .drawer-nav .switch { font-weight: bold; } .drawer-nav .open { text-decoration: underline; } .drawer-nav dt.switch a:before { content: ''; height: 10px; width: 2px; display: block; background: #DCBE78; position: absolute; top: 21px; left: 9px; } .drawer-nav dt.switch a:after { content: ''; height: 2px; width: 10px; display: block; background: #DCBE78; position: absolute; top: 25px; left: 5px; } .drawer-nav dt.open a:before { display: none; } .hamburger-text { position: absolute; bottom: -4px; font-size: 14px; font-size: 1.4rem; left: 0.4rem; } #waypoint-anchor { position: absolute; top: 70px; } /***** スクロールメニュー *****/ #scroll-menu { display: block; height: 40px; background-color: #f9f8f6; margin: 7px 0 0; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; } #scroll-menu { overflow-x: auto; } #scroll-menu::-webkit-scrollbar { width: 5px; background: #FFF; } #scroll-menu::-webkit-scrollbar:horizontal { height: 5px; background: #FFF; } #scroll-menu::-webkit-scrollbar-thumb { background: #f2ede1; border-radius: 2px; } #scroll-menu::-webkit-scrollbar-thumb:horizontal { background: #f2ede1; border-radius: 2px; } #scroll-menu .scroll-menu-inner { list-style-type: none; width: 1150px; height: 100%; margin: 0; padding: 0; text-align: center; } #scroll-menu ul li { float: left; height: 100%; margin: 0; } #scroll-menu a { border-left: 2px solid #fff; display: block; height: 100%; padding: 0 21px; color: #333; font-size: 18px; font-size: 1.8rem; text-decoration: none; line-height: 40px; } #scroll-menu a:active { background-color: #555; } /***** street *****/ .street .movie { position: relative; width: 100%; padding-top: 56.25%; width: 100%; } .street .movie iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; } /***** not found *****/ /***** 占い *****/ .wp-block-columns.horoscope__columns--element { gap: 0; } .wp-container-73{ display: flex; } .wp-container-73 figure{ /* width: 40%; */ } .author__div--round-yellow p.author__p--position { margin: 10px 0 0px; } .author__div--round-yellow p.author__p--about{ margin-bottom: 10px; line-height: 1.4; } } /* ********************************************************************************** max 480px ********************************************************************************** */ @media (max-width: 480px) { img { width: 100%; } .bloc-entry hr { width: 100%; } #column-two { display: block; } #bloc-left { width: 100%; } #bloc-right { width: 100%; } /* .header-entry h1 { padding: 0 0 5px; } */ #logo-header, /* #wrapper-main, */ #wrapper-footer footer { margin: 0 auto; width: 100%; } #logo-header { padding: 1px 0 20px; } #logo-header h1 { margin: 10px 6% 0; text-align: center; width: -webkit-calc(100% - 50px); width: calc(100% - 50px); } #logo-header h1 img { width: 100%; max-width: 180px; } #logo-header #sns-header { position: relative; left: 0; top: 0; width: 100%; } #sns-header ul { text-align: center; } #sns-header ul li { margin: 0 1.0rem; } #logo-header #search label { display: none; } #logo-header #search input { padding: .5rem 1rem; width: 60%; } #logo-header #search button { padding: .5rem 1rem; width: 20%; } .pure-toggle-label { display: block; } #nav-global { display: none; } .thumbnail { padding: 15px 0 15px 0; } .share-icons { margin: 5px 0 0; } .share-icons .fb_iframe_widget, .share-icons .twitter-share-button { vertical-align: top; } /* #top_slider{ margin-bottom: calc(100vw * (216 / 760)) !important; height: 216px; } */ #bloc-new .cattag { margin: 1.0rem 1.5rem 0; } #bloc-new .photo, #bloc-new .info { display: table-cell; font-size: 18px; font-size: 1.8rem; line-height: 1.2; padding: 5px 0 0 .5rem; vertical-align: top; } #bloc-new .info span.postscript { color: #777; font-size: 13px; font-size: 1.3rem; } .curator { margin: 0px 10px 15px; } #bloc-new .photo { width: 130px; height: 90px; } #bloc-new .photo img { font-size: 10px; font-size: 1.0rem; text-align: left; } #bloc-new>ul { flex-wrap: wrap; } #bloc-new>ul>li { -webkit-flex-basis: 100%; flex-basis: 100%; margin: 0 0 7px; } #bloc-new>ul>li>a { border-bottom: 2px solid #e6e6e6; padding: 0 0 7px 0; display: table; margin: 0 10px; } #bloc-new .icon { height: 54px; width: 32px; left: 10px; top: -11px; } #bloc-entrylist { box-sizing: border-box; /* padding: 1rem; */ width: 100%; } #bloc-entrylist .info .cattag { margin: 1.0rem 0 0 95px; } /* #bloc-entrylist article { display: table; border-bottom: 2px dotted #e6e6e6; min-height: 65px; overflow: hidden; padding: 0 0 10px; width: 100%; } */ /* #bloc-entrylist article .photo { display: table-cell; min-height: 66px; width: 80px; } */ #bloc-entrylist article .photo a { min-height: inherit; } /* #bloc-entrylist article .photo a img { font-size: 10px; font-size: 1.0rem; width: 80px; } */ /* #bloc-entrylist article .info { border-bottom: none; display: table-cell; -webkit-flex-basis: -webkit-calc(100% - 100px); flex-basis: calc(100% - 100px); margin: 0 0 0 5px; vertical-align: top; } */ /* #bloc-entrylist .info h3 { font-size: 17px; font-size: 1.7rem; margin: 0 0 0 9px; } */ #bloc-entrylist .info .curator { margin: 16px 0 0; } /* #bloc-entrylist article:not(:first-of-type) { margin: 10px 0 0; } */ #bloc-entrylist .info p.postscript { margin: 3px 10px 0 9px; } #bloc-ranking h2 img, #bloc-pickupentry h2 img, #bloc-insta h2 img, #bloc-entrylist h2 img { width: auto; } #bloc-ranking li { border-bottom: 2px dotted #e6e6e6; } #bloc-ranking .info { font-size: 16px; font-size: 1.6rem; padding: 0 0 0 1rem; } #bloc-ranking h2 { height: 35px; width: initial; } #bloc-ranking .photo img { width: 63px; } #bloc-ranking div.mcol:before { left: 8px; top: 5px; } #bloc-pickupentry h2 { height: 37px; } #bloc-pickupentry .photo img { width: 63px; } #bloc-pickupentry .info { font-size: 16px; font-size: 1.6rem; } #bloc-banner img { width: 96%; margin: 0 2%; } #nav-footer ul { padding: 0 1rem; text-align: center; } footer .bnr_page ul{ display: block; } footer .bnr_page ul li{ width: 80%; } #search-footer { margin: 1.0rem 0 0; } #copyright { margin: 1.0rem 0 0; } .bloc-entry { overflow-x: hidden; } /***** インスタグラム *****/ #bloc-insta h2 { height: 48px; } #bloc-insta ul { height: 100%; } #instafeed li { width: -webkit-calc((100% - 20px) / 3); width: calc((100% - 20px) / 3); margin: 0 10px 0 0; } #instafeed li:nth-of-type(3n) { margin: 0; } /***** 下層ページ *****/ .bloc-entry .image-main { width: 100%; } .bloc-entry .body-entry { width: 100%; } /* .bloc-entry .body-entry img { height: 100%; } */ /* .bloc-entry .info-entry { width: 100%; } */ .bloc-entry .curator { background-color: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin: 20px auto 0; /* padding: 15px 0 0px 0; */ width: 100%; } .bloc-entry .thumbnail>.mcol, #bloc-entrylist .thumbnail>.mcol { display: block; } #bloc-entrylist .info time, #bloc-entrylist .info .thumbup { -webkit-flex-basis: 100%; flex-basis: 100%; text-align: left; } .bloc-entry .info-entry-simple table { display: block; } .bloc-comment form { margin: 25px auto; width: 100%; } /* .bloc-comment form p label { width: 25%; } */ .bloc-comment form li label { padding: 0 0 20px; text-align: left; width: 30%; } .bloc-comment form li input { width: 90%; } .bloc-comment form li textarea { width: 95%; } .bloc-comment .btn button { margin: 8px 0 0; width: 68%; } .bloc-comment .item-reply { border-bottom: 1px dotted #aaa; padding: 0 0 5px; } .bloc-comment .reply h4 { margin: 10px 10px 0 0; } /* .info-entry th, .info-entry td { padding: 2.0rem 8px; } */ .curator .thumbup { margin: 4px 0 0; text-align: left; } .gallery-entry figure { -webkit-flex-basis: 100%; flex-basis: 100%; margin: 3.0rem 0 0; } .gallery-entry figure:first-of-type { margin: 0; } .gallery-entry figure:nth-of-type(n+4) { margin: 3.0rem 0 0; } .gallery-entry figure figcaption { font-size: 1.5rem; margin: 0 auto; width: 100%; } .entry header ul { padding: 0; } .yarpp-related { margin: 4em 0 !important; } .yarpp-thumbnails-horizontal .yarpp-thumbnail { width: 127px; } /***** 店舗情報引用 *****/ #shop_quote { width: 100%; } #shop_quote table { width: 100%; } #shop_quote td { padding: 3px 5px; } /* .bloc-entry .info-entry-simple table td.sp-tel span { display: none; }*/ /***** イベント情報 *****/ .event_entrybloc { padding: 0; } .event_info td a { word-break: break-all; } /* .event_info th { padding: 2.0rem 0; width: 85px; } */ .event_info .map { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .event_info .map iframe, .event_info .map object, .event_info .map embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } /***** スクロールメニュー *****/ #scroll-menu { display: block; height: 40px; background-color: #f9f8f6; margin: 7px 0 0; overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; } #scroll-menu { overflow-x: auto; } #scroll-menu::-webkit-scrollbar { width: 5px; background: #FFF; } #scroll-menu::-webkit-scrollbar:horizontal { height: 5px; background: #FFF; } #scroll-menu::-webkit-scrollbar-thumb { background: #f2ede1; border-radius: 2px; } #scroll-menu::-webkit-scrollbar-thumb:horizontal { background: #f2ede1; border-radius: 2px; } #scroll-menu .scroll-menu-inner { list-style-type: none; width: 1150px; height: 100%; margin: 0; padding: 0; text-align: center; } #scroll-menu ul li { float: left; height: 100%; margin: 0; } #scroll-menu a { border-left: 2px solid #fff; display: block; height: 100%; padding: 0 17px; color: #333; font-size: 15px; font-size: 1.5rem; text-decoration: none; line-height: 40px; } #scroll-menu a:active { background-color: #555; } /***** ライター情報 *****/ #writer_profile { display: block; padding: 0; width: 100%; } #writer_profile .writer_image { text-align: center; } #writer_profile .writer_image, #writer_profile .writer_text { display: block; padding: 0; width: 100%; } #writer_profile .writer_text p.writer_name { text-align: center; } /* .writer-profile { box-sizing: border-box; margin: 3rem 0; padding: 2rem 1rem; width: 50%; } */ .writer-profile:not(:nth-of-type(3n+1)) { border-left: none; } .writer-profile:not(:nth-of-type(2n+1)) { border-left: 1px dotted #a4a899; } /* .writer-profile .eyecatch { max-height: 120px; max-width: 120px; } */ /***** ランキング *****/ #page-ranking .tab li { padding: 12px 0px; margin: 0; width: 50%; } /***** ドロワー *****/ #drawer-waypoint { border-bottom: 2px solid #E6E6E6; opacity: 0; position: fixed; visibility: hidden; width: 100%; transition: .5s; } #drawer-waypoint.scroll { background: #fff; padding: 17px 0 10px; position: fixed; width: 100%; z-index: 5; transition: .5s; visibility: visible; width: 100%; opacity: 1; } #drawer-waypoint p { margin: 0; text-align: center; display: inline-block; width: -webkit-calc((100% - 115px)); width: calc((100% - 115px)); vertical-align: top; } #drawer-waypoint p>a { margin: 0 0 0 -22px; } #drawer-waypoint p>a img { height: 28px; width: auto; } #drawer-waypoint ul { display: inline-block; margin: 4px 0 0; } #drawer-waypoint ul li { display: inline-block; line-height: 1; margin: 0 0 0 .5rem; } #drawer-waypoint ul li img { vertical-align: text-bottom; width: 22px; } .drawer-nav { width: 50%; } .drawer--right .drawer-hamburger, .drawer--right.drawer-open .drawer-nav, .drawer--right.drawer-open .drawer-navbar .drawer-hamburger { right: 0px; } .drawer-nav>ul:first-of-type { padding: 70px 10px 0; } .drawer-nav>ul>li { border-top: 1px solid #A4A899; margin: 0; } .drawer-nav>ul>li:last-child { border-bottom: 1px solid #A4A899; } .drawer-nav li dl { margin: 0; } .drawer-nav li a { display: inline-block; font-size: 14px; font-size: 1.4rem; padding: 9px 0 9px 10px; position: relative; text-decoration: none; width: 100%; } .drawer-nav #sidemenu dd.contentWrap ul li a:before { content: ""; display: inline-block; border-style: solid; border-width: 3px 0 3px 6px; border-color: transparent transparent transparent #DCBE78; margin: 0 5px 2px 0; } .drawer-nav .displayNone { display: none; margin: 0; } .drawer-nav .accordion { margin: 0 0 10px; padding: 10px; border: 1px solid #ccc; } .drawer-nav .switch { font-weight: bold; } .drawer-nav .open { text-decoration: underline; } .drawer-nav dt.switch a:before { content: ''; height: 10px; width: 2px; display: block; background: #DCBE78; position: absolute; top: 14px; left: 9px; } .drawer-nav dt.switch a:after { content: ''; height: 2px; width: 10px; display: block; background: #DCBE78; position: absolute; top: 18px; left: 5px; } .drawer-nav dt.open a:before { display: none; } .drawer-hamburger { width: 3rem; } .hamburger-text { font-size: 10px; font-size: 1.0rem; position: absolute; bottom: 0; left: 0; text-align: center; width: 4.5rem; } #waypoint-anchor { position: absolute; top: 50px; } /***** street *****/ .street .movie { position: relative; width: 100%; padding-top: 56.25%; } .street .movie iframe { position: absolute; top: 0; right: 0; width: 100% !important; height: 100% !important; } /***** recruit *****/ .recruit .info-entry h3 { border: 1px solid #DC8046; background-color: #F7EDE3; background-image: none; color: #333; font-size: 1.6rem; height: auto; line-height: 1.8rem; margin: 0; padding: 10px; } /***** writerwanted *****/ #writerwanted h3 { font-size: 25px; font-size: 2.5rem; text-shadow: 0 -3px 1px #fff, 0 3px 1px #fff, -3px 0 1px #fff, 3px 0 1px #fff, 3px 0px 4px #ccc, -1px 0px 4px #ccc, 0px 3px 4px #ccc, 0px -1px 4px #ccc; } #writerwanted h3 span { font-size: 19px; font-size: 1.9rem; text-shadow: 0 -2px 1px #fff, 0 2px 1px #fff, -2px 0 1px #fff, 2px 0 1px #fff, 2px 0px 3px #ccc, -1px 0px 3px #ccc, 0px 2px 3px #ccc, 0px -1px 3px #ccc; } #writerwanted #reporter_req { display: block; } #writerwanted #reporter_req>li { border-right: none; display: block; padding: 0; width: 100%; } #writerwanted #reporter_req>li { margin: 20px 0 0; } #writerwanted #reporter_req>li>h4 { margin: 0; } #writerwanted #reporter_req>li>ul { margin: 10px 0 0; } #writerwanted #reporter_req>li:first-child, #writerwanted #reporter_req>li:last-child { padding: 0; } #writerwanted #reporter_req>li:last-child p { margin: 10px 0 0; } #writerwanted #reporter_req>li>ul>li, #writerwanted #reporter_req>li:last-child>ul { margin: 0; } #writerwanted #process dt { display: block; margin: 0 0 15px; width: 100%; } #writerwanted #process dt:after { display: none; } #writerwanted #process dd { display: block; margin: 0 auto 5px; width: 100%; min-height: 39px; } #writerwanted #process dd .br-style:before { display: none; } #writerwanted #process dt span.ahead { background: #22ac38; border-radius: 40px; color: #fff; display: inline-block; font-size: 18px; font-size: 1.8rem; font-weight: bold; line-height: 1.2; height: auto; width: 100%; padding: 3px 0 2px 0; } #writerwanted #process dd div { background: none; border-radius: 0; box-shadow: none; height: auto; width: 100%; position: relative; } #writerwanted #process dd p { display: table-cell; font-size: 14px; font-size: 1.4rem; color: #333; height: 33px; line-height: 1.4; margin: 0; min-height: inherit; padding: 0 0 0 38px; text-align: left; vertical-align: middle; } #writerwanted #process dd span.apoint { left: 0; top: 3px; } #writerwanted #guarantee { margin: 30px 0 0; } #writerwanted #guarantee p.ahead span { background: #22ac38; border-radius: 40px; color: #fff; display: inline-block; font-size: 18px; font-size: 1.8rem; font-weight: bold; line-height: 1.2; height: auto; width: 100%; padding: 3px 0 2px 0; } #writerwanted #guarantee>p.ahead { float: initial; margin: 0; width: 100%; } #writerwanted #guarantee ul { display: block; float: initial; margin: 15px 0 0; overflow: hidden; padding: 11px 0; width: 100%; } #writerwanted #guarantee li { border-right: none; border-left: 1px dotted #956134; display: block; float: left; width: -webkit-calc((100% - 18px) / 2); width: calc((100% - 18px) / 2); } #writerwanted #guarantee li:first-of-type, #writerwanted #guarantee li:nth-of-type(3) { border-left: none; } #writerwanted #guarantee li:first-of-type, #writerwanted #guarantee li:nth-of-type(2) { margin: 0 0 20px 0; } #writerwanted #guarantee li p { margin: 5px 10px 0; } #writerwanted #apply p { float: inherit; } #writerwanted #apply p:first-of-type { margin: 20px 0 0; } #writerwanted #apply p:first-of-type, #writerwanted #apply p:last-of-type { width: 100%; } #writerwanted #apply p span.ahead { background: #22ac38; border-radius: 40px; color: #fff; display: inline-block; font-size: 18px; font-size: 1.8rem; font-weight: bold; line-height: 1.2; height: auto; width: 100%; padding: 3px 0 2px 0; } #writerwanted #inquiry p { border-right: none; display: -webkit-box; text-align: left; margin: auto; width: 95%; } #writerwanted #inquiry ul { display: block; padding: 0; margin: auto; width: 95%; } /***** not found *****/ .category #bloc-entrylist .not-found #icon_not_found { position: initial; right: 0; top: 0; text-align: center; } .category #bloc-entrylist .not-found #icon_not_found img { width: 210px; } .category #bloc-entrylist .not-found #search { width: 320px; margin: auto; position: relative; } .category #bloc-entrylist .not-found #search label { color: #dc7d42; display: inline-block; position: absolute; top: .2rem; left: 1rem; } .category #bloc-entrylist .not-found #search input { border-color: #dc7d42; border-radius: 5px; border-style: solid; border-width: 1px; padding: 0 0 0 2rem; width: 215px; } .category #bloc-entrylist .not-found #search button { background: #dc7d42; border: none; /*border-radius: 5px;*/ color: #fff; margin: 0 0 0 .5rem; padding: .1rem 1rem; } .category #bloc-entrylist .not-found #search button:first-letter { letter-spacing: 1rem; } } /***** twitterシェアボタン *****/ .twitter-share-button, .twitter-share-button-rendered, .twitter-tweet-button { vertical-align: top; } /***** 20180416 見出しcss追加 *****/ /* .bloc-entry h1 { position: relative; padding: 0.6em; background: #dc7d42; border-radius: 7px; margin: 0 0 3rem 0; color: #fff; font-size: 16px; } .bloc-entry h1:after { position: absolute; content: ''; top: 100%; left: 30px; border: 15px solid transparent; border-top: 15px solid #dc7d42; width: 0; height: 0; } */ .bloc-entry h5,.bloc-entry h6 { background: #ffffff; /* color: #fff; */ font-size: 1.9rem; padding: 10px 18px; position: relative; text-align: center; border: 2px solid #1c1c1c; border-radius: 200px; } .bloc-entry h5:after,.bloc-entry h6:after { border: 10px solid transparent; border-top: 18px solid #ffffff; content: ''; position: absolute; left: 78px; bottom: -25px; right: 0; width: 0; height: 0; filter: drop-shadow(0 4px 0 black); } /* .bloc-entry h6 { position: relative; padding: 0.6em; background: #dc7d42; border-radius: 7px; margin: 0 0 3rem 0; color: #fff; font-size: 2.3rem; } .bloc-entry h6:after { position: absolute; content: ''; top: 100%; left: 30px; border: 15px solid transparent; border-top: 15px solid #dc7d42; width: 0; height: 0; } */ /* #cfrom7 { padding: 20px; } #cfrom7 table {} #cfrom7 table td { padding: 10px 0; border-bottom: solid 1px #E8E8E8; } #cfrom7 .btn { text-align: center; margin-top: 20px; } #cfrom7 .hissu { border-style: none; background-color: #FFC8C8; color: #FF6A6C; padding: 5px; margin-left: 5px; border-radius: 3px; font-size: 80%; } #cfrom7 input[type="submit"] { border-style: none; background-color: #DC7D42; color: #FFFFFF; padding: 1em 2em; } @media (max-width: 768px) { #cfrom7 { padding: 0px; } #cfrom7 table td { display: block; } #cfrom7 .wpcf7-text { width: auto; } #cfrom7 .wpcf7-textarea { width: 95%; } #cfrom7 input[type="text"], #cfrom7 input[type="email"], #cfrom7 input[type="tel"], #cfrom7 select, #cfrom7 textarea { border: solid 1px #E8E8E8; } } */ .banner_takeout_pc { display: block; max-width: 1000px; overflow: hidden; margin: 40px auto; } .banner_takeout_sp { display: none; } @media (max-width: 768px) { .banner_takeout_pc { display: none; } .banner_takeout_sp { display: block; margin: 5% 5% 0% 5%; } } .banner_chekipop { display: block; max-width: 1000px; overflow: hidden; margin: 40px auto; text-align: center; } .banner_chekipop img { width: 400px; } @media (max-width: 768px) { .banner_chekipop { margin: 5% 5% 0% 5%; } .banner_chekipop img { width: 100%; } } .banner-bottom { margin: 0 0 20px 0; } .gnav { width: 1000px; padding: 0; margin: auto; font-size: 0; list-style: none; } .gnav li { width: 20%; margin: 0; padding: 0; font-size: 16px; display: inline-block; } /* ページ追加 */ div.sdgs h2 { text-align: center; font-weight: bold; color: #1687EC; font-size: 180%; } div.sdgs .image-2 { width: 100%; margin: auto auto 30px auto; } @media (max-width: 896px) { div.sdgs .image-2 { width: 100%; margin: auto auto 20px auto; } } div.sdgs ul { padding: 0; margin: 0; list-style: none; overflow: hidden; } div.sdgs ul li { margin: auto auto 15px auto; display: flex; justify-content: space-between; } div.sdgs ul li:last-child { margin: auto auto 0px auto; } div.sdgs ul li .icon { width: 120px; margin: 0 auto 0 0; } @media (max-width: 896px) { div.sdgs ul li .icon { width: 20%; margin: 0 auto 0 0; } } div.sdgs ul li .block { width: 550px; margin: 0 0 0 auto; } @media (max-width: 896px) { div.sdgs ul li .block { width: 70%; margin: 0 auto 0 0; } } div.sdgs ul li .block .title { font-size: 110%; margin: auto auto auto auto; font-weight: bold; } div.sdgs ul li .block p { font-size: 110%; line-height: 30px; padding: 0; margin: 0; } @media (max-width: 896px) { div.sdgs ul li .block p { font-size: 100%; line-height: 24px; } } /* SVG アニメーション */ /*************************************************** * Generated by SVG Artista on 11/7/2022, 5:58:48 PM * MIT license (https://opensource.org/licenses/MIT) * W. https://svgartista.net **************************************************/ .svg-elem-1 { stroke-dashoffset: 501.0277404785156px; stroke-dasharray: 501.0277404785156px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.8s; } .svg-elem-1.active { stroke-dashoffset: 0; fill: rgb(255, 255, 255); } .svg-elem-2 { stroke-dashoffset: 1000.08837890625px; stroke-dasharray: 1000.08837890625px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.12s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1s; } .svg-elem-2.active { stroke-dashoffset: 0; fill: rgb(28, 28, 28); } .svg-elem-3 { stroke-dashoffset: 95.1460189819336px; stroke-dasharray: 95.1460189819336px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2000000000000002s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.24s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.2000000000000002s; } .svg-elem-3.active { stroke-dashoffset: 0; fill: rgb(28, 28, 28); } .svg-elem-4 { stroke-dashoffset: 216.55328369140625px; stroke-dasharray: 216.55328369140625px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.4000000000000001s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.36s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.4000000000000001s; } .svg-elem-4.active { stroke-dashoffset: 0; fill: rgb(28, 28, 28); } .svg-elem-5 { stroke-dashoffset: 91.9556884765625px; stroke-dasharray: 91.9556884765625px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.6s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.48s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.6s; } .svg-elem-5.active { stroke-dashoffset: 0; fill: rgb(28, 28, 28); } .svg-elem-6 { stroke-dashoffset: 472.9430236816406px; stroke-dasharray: 472.9430236816406px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.8s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.6s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 1.8s; } .svg-elem-6.active { stroke-dashoffset: 0; fill: rgb(255, 255, 255); } .svg-elem-7 { stroke-dashoffset: 941.337158203125px; stroke-dasharray: 941.337158203125px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.72s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2s; } .svg-elem-7.active { stroke-dashoffset: 0; fill: rgb(28, 28, 28); } .svg-elem-8 { stroke-dashoffset: 472.9430236816406px; stroke-dasharray: 472.9430236816406px; fill: transparent; -webkit-transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.2s; transition: stroke-dashoffset 1.4s cubic-bezier(0.47, 0, 0.745, 0.715) 0.84s, fill 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) 2.2s; } .svg-elem-8.active { stroke-dashoffset: 0; fill: rgb(255, 255, 255); }