★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */ /* ================================================================================ Site origin 不要設定解除 ※案件によって使い分けてください。 ※価格表のcssと一緒に使うとバグりますので、その時は個別に設定すると吉です。 ================================================================================ */ /* ================================================================================ 新着情報レイアウト ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .default_blog{ width:1000px!important; margin:0 auto; margin-bottom:100px; background-color:#FFFFFF; border:10px #9b8a83 solid; vertical-align:middle; -webkit-border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; border-radius:10px 10px 10px 10px; line-height:10px!important; padding:60px 60px 50px 60px; margin-bottom:40px; margin-top:-70px; } .default_blog li{ padding-bottom:15px; margin-bottom:20px; border-bottom:solid 1px #c0955e; } .default_blog_date{ display:inline; font-size:19px; color:#73554a; margin-left:30px; } .default_blog_date:before{ content:url("../img/default_blog_arrow.png"); background-size:contain; vertical-align:middle; position: absolute; margin-top:-14px; margin-left:-30px; } .default_blog_title{ display:inline; font-size:19px; color:#ff8043; margin-left:15px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .default_blog{ width:90%!important; margin:0 auto; margin-bottom:100px; background-color:#FFFFFF; border:5px #9b8a83 solid; vertical-align:middle; -webkit-border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; border-radius:10px 10px 10px 10px; line-height:10px!important; padding:40px 40px 30px 40px!important; } .default_blog li{ margin-bottom:30px; padding-bottom:15px; border-bottom:solid 1px #c0955e; } .default_blog_date{ font-size:17px; color:#73554a; margin-left:30px; } .default_blog_date:before{ content:url("../img/default_blog_arrow.png"); background-size:contain; vertical-align:middle; position: absolute; margin-top:-14px; margin-left:-30px; } .default_blog_title{ font-size:17px; color:#ff8043; margin-left:30px; margin-top:20px; } } /* ================================================================================ ブログデフォルト設定（いつものブログ設定） ================================================================================ */ /* PC */ @media (min-width: 768px) { .blog_wrap{ margin-top:130px; width:1000px!important; } .blog_wrap p{ overflow:hidden; padding:40px; line-height:32px; font-size:18px; } .blog_wrap img{ max-width:800px; height:auto; padding:15px 0 15px 0; } .category_blog_title h2{ text-align:center!important; color:#ff8043; font-size:32px; border-bottom:solid 1px #ff8043; padding:0 10px 12px; line-height:60px; margin:0 auto; padding-bottom:60px; } .post-categories{ display:inline; } .blog_wrap > ul{ margin:0 auto; margin-bottom:100px; background-color:#FFFFFF; border:3px #ff8043 solid; -webkit-border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; border-radius:10px 10px 10px 10px; line-height:10px!important; padding:60px 60px 50px 60px; margin-bottom:40px; } .blog_wrap > ul >li{ margin-bottom:60px; padding-bottom:30px; border-bottom:1px dotted; } .blog_title_link{ text-align:center!important; color:#ff8043; font-size:27px; border-bottom:solid 1px #ff8043; padding:0 10px 12px; line-height:60px; margin:0 auto; } .blog_title_link span{ font-size:14px; margin-left:8px; } /* 人気記事 */ .popular_post_wrap{ padding:100px 0 30px; text-align:center; } .popular_post_wrap h2{ display:lnline; text-align:center!important; color:#ff8043; font-size:27px; padding:0 10px 12px; line-height:60px; margin:0 auto; margin-bottom:16px; } .popular_post_wrap ul{ overflow:hidden; width:1000px; margin:0 auto; } .popular_post_wrap ul li{ float:left; width:320px; margin-right:20px; background-color:#FFFFFF; clear:none; padding:10px; margin-bottom:-1000px; padding-bottom:1010px; } .popular_post_wrap ul li:last-child{ margin-right:0px; } .popular_post_wrap ul li img{ float:none; display:block; margin:0 auto 8px; } .popular_post_wrap ul li a{ float:none; display:block; text-align:center; font-size:inherit; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; } .popular_post_wrap ul li span{ float:none; display:block; text-align:center; } /* 最近の投稿・アーカイブ */ .blog_function_wrap_inner{ padding:24px 0 0; } .blog_function_wrap_inner > ul{ overflow:auto; width:1000px; margin:0 auto; } .blog_function_wrap_inner > ul > li a{ font-size:16px; } .blog_function_wrap_inner > ul > li:nth-of-type(1){ width:50%; padding:0 40px 16px; float:left; } .blog_function_wrap_inner > ul > li:nth-of-type(2){ width:50%; padding:0 24px 16px; float:left; } /* .blog_function_wrap_inner > ul > li:nth-of-type(3){ width:33.3%; padding:0 24px 16px; float:left; } */ .blog_function_wrap_inner > ul > li > ul{ width:100%; height:210px; overflow:auto; text-align:center; } .blog_function_wrap_inner > ul > li > ul > li{ font-size:16px; /* font-size:14px; */ line-height:40px; } .blog_function_wrap_inner h2{ display:lnline; text-align:center!important; color:#ff8043; font-size:27px; padding:0 10px 12px; line-height:60px; margin:0 auto; margin-bottom:16px; } .blog_function_wrap_inner .recent_title_text{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; width:76%; display:block; float:left; text-align:left; border-bottom:solid 1px #DCDCDC; } .blog_function_wrap_inner .recent_title_date{ font-size:16px; width:24%; display:block; float:left; text-align:right; border-bottom:solid 1px #DCDCDC; } .blog_list_link{ text-align:right; margin-top:-30px!important; } .blog_list_link a{ font-size:20px; color:#ff8043; padding-right:8px!important; font-weight:bold; } /* ページ送り */ .prevnext-nav{ margin-top:30px; } .prevnext-nav__left a,.prevnext-nav__right a{ padding:10px; background-color:#ff8043; color:#FFFFFF; -webkit-border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; border-radius:10px 10px 10px 10px; } } /* SP */ @media (max-width: 767px) { .blog_wrap{ margin-top:60px; } .blog_wrap p{ overflow:hidden; padding:10px; line-height:32px; font-size:14px; } .blog_wrap img{ height:auto; padding:15px 0 15px 0; } .category_blog_title h2{ text-align:center!important; color:#ff8043; font-size:24px; border-bottom:solid 1px #ff8043; padding:0 10px 12px; line-height:60px; margin:0 auto; padding-bottom:60px; } .post-categories{ display:inline; } .blog_wrap > ul{ margin:0 auto; margin-bottom:100px; background-color:#FFFFFF; border:3px #ff8043 solid; -webkit-border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; border-radius:10px 10px 10px 10px; line-height:10px!important; margin-bottom:40px; padding:15px; } .blog_wrap > ul >li{ margin-bottom:60px; padding-bottom:30px; border-bottom:1px dotted; } .blog_title_link{ text-align:center!important; color:#ff8043; font-size:18px; border-bottom:solid 1px #ff8043; padding:0 10px 12px; line-height:60px; margin:0 auto; } .blog_title_link span{ font-size:14px; margin-left:8px; } /* 人気記事 */ .popular_post_wrap{ text-align:center; margin-top:60px; } .popular_post_wrap h2{ display:lnline; text-align:center!important; color:#ff8043; font-size:27px; line-height:60px; margin:0 auto; margin-bottom:16px; } .popular_post_wrap ul{ margin:0 auto; } .popular_post_wrap ul li{ width:100%; background-color:#FFFFFF; padding:10px; margin-bottom:15px; } .popular_post_wrap ul li:last-child{ margin-right:0px; } .popular_post_wrap ul li img{ float:none; display:block; margin:0 auto 8px; } .popular_post_wrap ul li a{ float:none; display:block; text-align:center; font-size:inherit; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; } .popular_post_wrap ul li span{ float:none; display:block; text-align:center; } /* 最近の投稿・アーカイブ */ .blog_function_wrap_inner{ padding:24px 0 0; } .blog_function_wrap_inner > ul{ overflow:auto; margin:0 auto; } .blog_function_wrap_inner > ul > li a{ font-size:16px; } .blog_function_wrap_inner > ul > li:nth-of-type(1){ width:100%; padding:0 20px 16px; } .blog_function_wrap_inner > ul > li:nth-of-type(2){ width:100%; padding:0 24px 16px; } /* .blog_function_wrap_inner > ul > li:nth-of-type(3){ width:33.3%; padding:0 24px 16px; float:left; } */ .blog_function_wrap_inner > ul > li > ul{ width:100%; overflow:auto; text-align:center; margin-bottom:30px; } .blog_function_wrap_inner > ul > li > ul > li{ font-size:16px; /* font-size:14px; */ line-height:40px; } .blog_function_wrap_inner h2{ display:lnline; text-align:center!important; color:#ff8043; font-size:27px; padding:0 10px 12px; line-height:60px; margin:0 auto; margin-bottom:16px; } .blog_function_wrap_inner .recent_title_text{ overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -webkit-text-overflow: ellipsis; -o-text-overflow: ellipsis; display:block; text-align:left; position:absolute; } .blog_function_wrap_inner .recent_title_date{ font-size:16px; display:block; text-align:right; border-bottom:solid 1px #DCDCDC; } .blog_list_link{ text-align:right; margin-top:-30px!important; } .blog_list_link a{ font-size:16px; color:#ff8043; padding-right:8px!important; font-weight:bold; } /* ページ送り */ .prevnext-nav{ margin-top:30px; } .prevnext-nav__left a,.prevnext-nav__right a{ padding:10px; background-color:#ff8043; color:#FFFFFF; -webkit-border-radius:10px 10px 10px 10px; -moz-border-radius:10px 10px 10px 10px; border-radius:10px 10px 10px 10px; } }