@charset "UTF-8"; /* Theme Name: TTS_osaki Author: Tohoku-Technical-Systems Description:東北テクニカルシステムズによるおおさき総合法律会計事務所のテーマ Version: 1.0 */ /*--------------------common--------------------*/ html { font-size: 62.5%; font-family: "MS Pゴシック",sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; } * { box-sizing: border-box; } body { font-size: 1.4em; color: #222; margin: 0; } article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block; } template { display: none; } a { background-color: transparent; text-decoration: none; } a:active, a:hover { outline: 0; } abbr[title] { border-bottom: 1px dotted; } b, strong { font-weight: bold; } dfn { font-style: italic; } mark { background: #ff0; color: #000; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } img { border: 0; max-width: 100%; height: auto; vertical-align: top; } svg:not(:root) { overflow: hidden; } figure { margin: 0; } hr { box-sizing: content-box; height: 0; } pre { overflow: auto; } code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em; } /* 入力系 */ button, input, optgroup, select, textarea { color: inherit; font: inherit; margin: 0; } button { overflow: visible; } button, select { text-transform: none; } button, html input[type="button"], input[type="reset"], input[type="submit"] { -webkit-appearance: button; cursor: pointer; } button[disabled], html input[disabled] { cursor: default; } button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } input { line-height: normal; } input[type="checkbox"], input[type="radio"] { box-sizing: border-box; padding: 0; } input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button { height: auto; } input[type="search"] { -webkit-appearance: textfield; box-sizing: content-box; } input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration { -webkit-appearance: none; } fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; } legend { border: 0; padding: 0; } textarea { overflow: auto; } optgroup { font-weight: bold; } /* リスト */ label { cursor: pointer; } table { border-collapse: collapse; border-spacing: 0; } td, th { padding: 0; } dl, dd { margin: 0; } ul { margin: 0; padding: 0; } li { list-style: none; margin: 0; } h1 { font-size: 3rem; /* font-family: serif;*/ line-height: 1.5; color: #222; } h2 { font-size: 2.2rem; /* font-family: serif;*/ color: #222; letter-spacing: 3px; border-left: #A0C653 solid 4px; padding: 0 0 0 16px; } h3 { font-size: 1.5714rem; color: #222; letter-spacing: 3px; margin-bottom: 1rem; } h4 { font-size: 1.2857rem; padding: 0.6429rem 1.5rem; color: #222; margin-top: 2.2857rem; margin-bottom: 1.4286rem; } #color_box h3 { clear: both; margin: 0 0 25px 0; padding: 10px 0 10px 40px; color: #FFF; font-size: 1.063em; font-weight: 400; background: #A0C653 url(../tts_osaki/images/icon_03.png) 20px center no-repeat; } #color_box h4 { clear: both; margin: 0 0 25px 0; padding: 10px 0 10px 40px; color: #FFF; font-size: 1.063em; font-weight: 400; background: #A0C653 url(../tts_osaki/images/icon_03.png) 20px center no-repeat; } h5 { font-size: 1.4rem; padding: 0.6429rem 1.5rem; margin-top: 1.3rem; margin-bottom: 0.5rem; color: #222; } h6 { font-size: 10px; } .image { margin: 10px 10px 10px 10px; text-align: center; } /*--------------------service--------------------*/ .tadv-color{ color: #A0C653; } .service { color: #222; background-color: #fff; font-size: 20px; } #sub_navi{ margin:0 0 40px 0; } #sub_navi li{ float:left; border: #A0C653 solid 2px; solid: 2px; width:40%; margin:0 20px 0 0; text-align:center; background:#F5F8E7; } #sub_navi li.on{ border: #A0C653 solid 2px; color:#FFF; font-weight:bold; background:#A0C653; } #sub_navi li a{ display:block; padding:20px 0 20px 0; } #sub_navi li.on a{ color:#FFF; } #service .smail_h{ float:right; display:inline-block; padding:10px 0 0 0; font-size:14px; } #service .line_h4{ background:url(../tts_osaki/images/icon_03.png) left 22px no-repeat; color:#A0C653; padding:10px 0 0 20px; font-size:1.500em; font-weight:bold; } #service .green_dl{ margin:0 0 40px 0; } #service .green_dl dt{ margin:0 0 2px 0; padding:0; color:#000; background:#eeeeee url(../tts_osaki/images/icon_maru_on.png) 97% center no-repeat; font-size:16px; border : none; background-size:20px auto; } #service .green_dl dt span{ display:block; padding:16px 0 16px 20px; width:85%; } #service .green_dl dt.open{ background:#A0C653 url(../tts_osaki/images/icon_maru_off.png) 97% center no-repeat; background-size:20px auto; color:#fff; } #service .green_dl dd{ display:none; margin:0px; padding:20px 20px 0 20px; font-size:15px; text-indent:1em; } #service .green_dl p{ margin:0 0 20px 0; } /*--------------------clearfix--------------------*/ .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; overflow:hidden; font-size:0.1em; line-height:0; } .clearfix { display: inline-block; } /* Holly Hack Targets IE Win only \*/ * html .clearfix { height: 1%; } .clearfix { display: block; } /*--------------------member--------------------*/ .help { font-size: 28px; font-family: 'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', serif; margin: 5px; color:#A0C653; } .is-style-stripes{ border-collapse: collapse; } .is-style-stripes th, .is-style-stripes td { border: 0px solid #000; padding-left: 10px; } .is-style-stripes tr:nth-child(odd) { background:#CDCDCD; } /*--------------------contact--------------------*/ .yellow_box { padding: 12px 24px; border: 2px solid; border-color: #F3EC67; } input[type="text"], input[type="url"], input[type="search"], input[type="email"], input[type="tel"] { font-size: 14px; line-height: 1.8; border: 2px solid rgba(34, 34, 34, 0.3); padding: 2px 5px; max-width: 100%; width: 100%; -webkit-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; background-color: #fff; border-color: #C0C0C0; border-radius:5px; } input[type="text"]:focus, input[type="text"]:active, input[type="url"]:focus, input[type="url"]:active, input[type="search"]:focus, input[type="search"]:active, input[type="email"]:focus, input[type="email"]:active, input[type="tel"]:focus, input[type="tel"]:active { outline: none; border-color: #C0C0C0; border-radius:5px; } textarea { border: 2px solid rgba(34, 34, 34, 0.3); font-size: 14px; width: 100%; padding: 16px 8px; -webkit-transition: all ease-in-out 0.2s; transition: all ease-in-out 0.2s; background-color: #fff; border-color: #C0C0C0; border-radius:5px; } textarea:focus, textarea:active { outline: none; border-color: #C0C0C0; box-shadow: inset 0 0 0px 3px #fff; } input[type="checkbox"] { width: 18px; height: 18px; vertical-align: middle; } input[type="radio"] { width: 18px; height: 18px; vertical-align: middle; } select { text-transform: none; display: block; width: 100%; height: 48px; padding: 8px 12px; font-size: 16px; line-height: 1.42857143; color: #222222; background-color: #fff; background-image: none; border: 2px solid rgba(34, 34, 34, 0.3); border-radius: 0 !important; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border-color ease-in-out .15s, -webkit-box-shadow ease-in-out .15s; -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s; } @media screen and (min-width: 0em) and (max-width: 767px) { select { width: 100%; } } /* プレイスホルダーの色変更 */ :placeholder-shown { color: rgba(34, 34, 34, 0.5); } /* Google Chrome, Safari, Opera 15+, Android, iOS */ ::-webkit-input-placeholder { color: rgba(34, 34, 34, 0.5); } /* Firefox 18- */ :-moz-placeholder { color: rgba(34, 34, 34, 0.5); } /* Firefox 19+ */ ::-moz-placeholder { color: rgba(34, 34, 34, 0.5); } /* IE 10+ */ :-ms-input-placeholder { color: #9FA0A0; } /* フォントサイズ系 */ p, .text-normal { margin-top: 0; margin-bottom: 0; font-size: 1.5rem; line-height: 2.5rem; } small, .text-small { font-size: 0.85em; } strong, .text-strong { font-weight: bold; } del, .text-del { text-decoration: line-through; } a, .text-link { color: #000; } a:hover, .text-link.text-link--hover { color: #66aedf; } a:active, .text-link.text-link--active { color: #277eb8; } pre { background: #FFFFF; overflow: auto; padding: 12px 16px; } code { font-family: Courier New, Courier, monospace; background: #f5f5f5; overflow: auto; padding: 6px 10px; margin-left: 4px; margin-right: 4px; } hr, .hr { border: 4px solid #cee0ec; margin-left: auto; margin-right: auto; max-width: 90%; margin-top: 100px; margin-bottom: 100px; } ul { padding-left: 2.5714rem; line-height: 2; } ul li { list-style-type: none; } ol { padding-left: 2.5714rem; line-height: 2; } ol li { list-style-type: none; } dl dt { font-size: 1.3rem; /* font-weight: bold;*/ margin-bottom: 0; background: #fff; color: #000; padding: 12px 24px; } dl dd { margin-bottom: 1.7143rem; border: 1px solid #fff; padding: 16px 24px; } .inline-list { list-style-type: none; padding-left: 0; } .inline-list li { display: inline-block; padding-left: 8px; padding-right: 8px; } blockquote { border-left: 8px solid #A0C653; padding-left: 32px; margin-top: 32px; margin-bottom: 32px; margin-left: 0; background: #f5f5f5; padding: 24px; } blockquote cite { display: block; text-align: right; } .c-button { display: block; background-color: #A0C653; color: #fff; text-decoration: none; font-size: 20px; line-height: 20px; font-weight: bold; width: 100%; max-width: 344px; text-align: center; padding: 17px 32px 17px 16px; margin: 3rem auto; border: 2px solid #A0C653; overflow: hidden; } @media screen and (min-width: 0em) and (max-width: 767px) { .c-button { min-width: 100%; font-size: 16px; padding: 9px 32px 9px 16px; } } .c-button:hover { opacity: 1; color: #fff; background-color:#094F14; } .c-button:hover:after { height: 450%; } .is-required { color: #cc2919; } .c-copyright { text-align: center; background: #A0C653; color: #fff; } .c-copyright p { margin-bottom: 0; color: #000; font-size: 1rem; padding-top: 2vh; padding-bottom: 2vh; } /*--------------------front--------------------*/ .c-front-text { padding-top: 1vh; padding-bottom: 1vh; text-align: center; } .c-front-text p { line-height: 2; } @media screen and (min-width: 0em) and (max-width: 372px) { .c-front-visual { text-align: center; position: relative; display: -webkit-box; display: flex; width: 100%; height: 250px; margin-left: 0; margin-right: 0; margin-top: 30px; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; background: url(../tts_osaki/images/main_bg_sp.jpg) no-repeat center top; } } @media screen and (min-width: 372px) and (max-width: 767px) { .c-front-visual { text-align: center; position: relative; display: -webkit-box; display: flex; width: 100%; height: 230px; margin-left: 0; margin-right: 0; margin-top: 30px; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; background: url(../tts_osaki/images/main_bg_ipad.jpg) no-repeat center top; } } @media screen and (min-width: 768px) { .c-front-visual { text-align: center; position: relative; display: -webkit-box; display: flex; width: 100%; height: 400px; margin-left: 0; margin-right: 0; margin-top: 30px; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; background: url(../tts_osaki/images/main_bg.jpg) no-repeat center top; } } .c-global-nav { margin-top: 3vh; background: #A0C653; overflow: auto; } .c-global-nav ul { display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; margin-left: 0; padding-left: 0; } .c-global-nav ul li { position: relative; list-style-type: none; } .c-global-nav ul li :hover { color: snow; background-color:#F3EC67; } .c-global-nav ul li a { text-decoration: none; display: list-item; color: #fff; padding-left: 3vw; padding-right: 3vw; padding-top: 1.8vh; padding-bottom: 1.8vh; font-weight: bold; /* font-family: serif;*/ -webkit-transition: all ease 0.2s; transition: all ease 0.2s; position: relative; } .c-global-nav ul li a:after { display: list-item; height: 14px; width: 1px; background: #ccc; -webkit-transform: skew(-15deg); -ms-transform: skew(-15deg); transform: skew(-15deg); position: absolute; right: -1px; top: 50%; margin-top: -7px; } .c-global-nav ul li:last-child a:after { display: none; } .c-header-description { letter-spacing: 2px; font-size: 0.8571rem; margin-bottom: 1vh; margin-top: 1vh; } .c-logo { text-decoration: none; color: #cee0ec; -webkit-transition: all ease 0.2s; transition: all ease 0.2s; } @media screen and (min-width: 0em) and (max-width: 767px) { .c-logo { display: -webkit-box; display: flex; width: 90%; margin-left: auto; margin-right: auto; justify-content: space-around; -webkit-box-align: left; align-items: left; } } .c-logo:hover { opacity: 0.8; } .c-logo__image { margin-bottom: 1vh; margin-left: 2vh; margin-right: 1vh; } .c-logo__image img { max-width: 100px; margin-left: auto; margin-right: auto; } @media screen and (min-width: 0em) and (max-width: 767px) { .c-logo__image img { max-width: 16vw; } } .c-main-visual { max-width: 100%; width: 100%; min-height: 21.4286rem; background: #efefef; } .c-media > img { width: 100%; max-width: 100%; margin-bottom: 0; } .c-media > figcaption { margin-top: 0; background: #efefef; text-align: center; padding: 0.5714rem 2.2857rem; } .c-menu { padding-left: 0; margin-left: 0; border-top: 1px solid #efefef; border-left: 1px solid #efefef; border-right: 1px solid #efefef; } .c-menu > li { list-style: none; } .c-menu > li > a { display: block; border-bottom: 1px solid #efefef; padding-top: 8px; padding-bottom: 8px; padding-left: 32px; padding-right: 32px; text-decoration: none; } .c-menu > li > a:hover, .c-menu > li > a.is-active { background: #cee0ec; color: #fff; } .c-navs-list > li { display: inline-block; } .c-navs-list > li > a { display: inline-block; padding: 0.5714rem 2.2857rem; background: #efefef; text-decoration: none; border-radius: 3px; } .c-navs-list > li > a:hover, .c-navs-list > li > a.is-active { background: #A0C653; color: #fff; } .c-navs-list.is-expand > li > a { padding: 0.5714rem 4.5714rem; } .c-page-header { width: 100%; max-width: 100%; padding-top: 4.5714rem; padding-bottom: 4.5714rem; background: #efefef; border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; text-align: center; } .c-page-header.is-left { text-align: left; } .c-page-header.is-right { text-align: right; } .c-page-header__title { font-size: 2.5714rem; } .c-page-header__subtitle { font-size: 1.1429rem; } .post-navigation, .paging-navigation { font-weight: 300; padding: 40px 0; color: #fff; background-color: #fff; } .post-navigation .nav-links, .paging-navigation .nav-links { margin: 20px 0; display: flex; justify-content: space-between; } .post-navigation .nav-links a, .paging-navigation .nav-links a { display: none; /* line-height: 1.7em; position: relative; display: inline-block; width: 214px; text-align: center; text-decoration: none; color: #fff; background: #A0C653; border: 1px solid #A0C653; */ } @media screen and (max-width: 640px) { .post-navigation .nav-links a, .paging-navigation .nav-links a { display: none; } } .post-navigation a[rel='next'] { float: right; text-align: center; } @media screen and (max-width: 640px) { .post-navigation a[rel='next'] { float: none; } } .paging-navigation .nav-previous { float: left; } .paging-navigation .nav-next { float: right; } @media screen and (max-width: 640px) { .paging-navigation .nav-previous { float: none; } .paging-navigation .nav-next { float: none; } } .pagination { font-weight: bold; overflow: hidden; clear: both; margin: 20px 0 80px 20px; text-align: center; } .pagination .page-numbers { display: inline; list-style: none; } .pagination a.page-numbers { color: #585858; background-color: #F6F6F6; display: inline-block; text-decoration: none; padding: 4px 10px; } .pagination span.current, .pagination a.page-numbers:hover { color: #FFF; background-color: #A0C653; display: inline-block; text-decoration: none; padding: 3px 10px; } .c-post-item { display: -webkit-box; display: flex; width: 100%; padding-top: 14px; padding-bottom: 14px; border-bottom: 1px solid #ccc; padding-left: 1vw; } .c-post-item__title a { color: #222; -webkit-transition: all ease 0.2s; transition: all ease 0.2s; } .c-post-item__title a:hover { text-decoration: none; } .c-post-item__date { /* font-family: serif;*/ padding-right: 3vw; letter-spacing: 0; position: relative; } .c-post-item__date:after { content: ""; display: block; height: 15px; width: 1px; background: #ccc; -webkit-transform: skew(-15deg); -ms-transform: skew(-15deg); transform: skew(-15deg); position: absolute; right: 18px; top: 7px; } .c-post-list { margin-top: 0vh; margin-bottom: 0vh; padding: 6vh 6vw; border-top: 1px solid #ccc; } @media screen and (min-width: 0em) and (max-width: 767px) { .c-post-list { padding-left: 0; padding-right: 0; } } .c-post-list__title { margin-top: 0; text-align: center; font-size: 1.7143rem; color: #222; } table { width: 100%; margin-bottom: 1.1429rem; } table > thead > tr { background: #fff; } table > thead > tr > th { color: #fff; background: #fff; padding: 14px 14px; border: 1px solid #ccc; } table > tbody > tr > th { background: #E0E0E0; color: #000; padding: 14px 18px; border: 0px solid #ccc; } table > tbody > tr > td { border: 0px solid #ccc; padding: 10px 0px 10px 0px; } .c-widget { margin-top: 8px; margin-bottom: 24px; } .c-widget__title { margin-top: 0; } .c-widget ul { border-top: 1px solid #ccc; margin-left: 0; padding-left: 0; } .c-widget ul li { list-style: none; } .c-widget ul li a { display: block; padding-top: 16px; padding-bottom: 16px; text-decoration: none; padding-left: 32px; position: relative; border-bottom: 1px solid #ccc; -webkit-transition: all ease 0.2s; transition: all ease 0.2s; } .c-widget ul li a:hover { background: #A0C653; color: #fff; border-color: #A0C653; } .c-widget ul li a:before { content: " › "; position: absolute; left: 16px; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } .entry-title { margin-top: 0; } .archive-title { margin-top: 0; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .archive-title { margin-bottom: 0; } } .c-post__title { font-size: 3rem; padding-bottom: 1.4286rem; border-bottom: 1px solid #ccc; margin-bottom: 3rem; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .c-post__title { font-size: 2rem; } } .c-post__meta { margin-top: 1.7143rem; padding: 8px 16px 8px 0px; background: white; /* font-family: serif;*/ margin-bottom: 3rem; } .c-post__meta a { text-decoration: none; } .c-post__meta .entry-date { margin-right: 16px; } .c-post__content h2 { font-size: 2rem; margin-top: 5.7143rem; position: relative; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .c-post__content h2 { font-size: 1.7143rem; margin-top: 2.8571rem; } } .c-post__content h2:before { content: ""; width: 20vw; height: 6px; background: #A0C650; left: -24vw; top: 50%; margin-top: -3px; position: absolute; } .cat-links { margin-bottom: 8px; } .cat-links a { background: #A0C650; color: #fff; display: inline-block; text-decoration: none; padding-left: 16px; padding-right: 16px; border-radius: 100px; letter-spacing: 0; padding-top: 2px; padding-bottom: 2px; font-size: 0.8571rem; margin-left: 8px; } .cat-links a:first-child { margin-left: 0; } .tags-links { padding-left: 16px; } .tags-links a { background: #ccc; color: #fff; display: inline-block; text-decoration: none; padding-left: 16px; padding-right: 16px; border-radius: 100px; letter-spacing: 0; padding-top: 2px; padding-bottom: 2px; font-size: 0.8571rem; margin-left: 8px; } .tags-links a:first-child { margin-left: 0; } .tags-links a:before { content: "#"; font-style: italic; display: inline-block; margin-right: 3px; } .l-aside { padding-top: 30px; width: 320px; float: left; } /*--------------------header-------------------*/ .header_top_margin { margin: 0px 0 0 0; height: 30px; } .header_top { display: flex; flex-direction: row; justify-content: space-between; } @media screen and (min-width: 0em) and (max-width: 767px) { .header_top { display: flex; flex-direction: column; } } .header_container_1 { text-align: left; display: flex; width: 60%; } @media screen and (min-width: 0em) and (max-width: 767px) { .header_container_1 { text-align: left; width: 100%; } } .header_container_2 { text-align: left; display: flex; width: 40%; justify-content: flex-end; margin-right: 10%; } @media screen and (min-width: 0em) and (max-width: 767px) { .header_container_2 { text-align: left; width: 100%; justify-content: center; margin-right: 10%; margin-bottom: 20px; } } .item_header_logo { width: 50px; height: 50px; margin: 10px 10px 30px 30px; } .item_header_text { font-weight: bold; letter-spacing: 0.3px; /* font-family: serif;*/ font-size: 2.4rem; color: #222; } @media screen and (min-width: 371px) and (max-width: 767px) { .item_header_text { font-size: 18px; } } @media screen and (min-width: 0em) and (max-width: 370px) { .item_header_text { font-size: 16px; } } @media screen and (min-width: 0em) and (max-width: 370px) { .header_sub_text { padding-left: 5px; margin-bottom: 3px; font-size: 10px; } } .header_sub_text { padding-left: 5px; margin-bottom: 3px; font-size: 10px; } .item_header_tel { width: 200px; height: 50px; margin: 10px 10px 10px 10px; } .item_footer_tel { width: 200px; height: 50px; } .header_time_text { /* font-family: serif;*/ font-size: 12px; margin: 0 0 0 0; text-align: center; width: 200px; } .header_image { width:200px; } .title-border { display: flex; justify-content: center; align-items: center; font-size: 10px; margin-bottom: 5px; } .title-border:before, .title-border:after { border-top: 1px solid #A0C653; content: ""; flex-grow: 0; width: 1em; } .title-border:before { margin-right: 10px; } .title-border:after { margin-left: 10px; } .title-no-border { display: flex; justify-content: center; align-items: center; font-size: 12px; margin: 1px 0 10px 0; } /*--------------------page-header-------------------*/ .page-visual { text-align: center; position: relative; display: -webkit-box; display: flex; width: 100%; height: 250px; margin-left: 0; margin-right: 0; margin-top: 30px; background: url(../tts_osaki/images/main.jpg) no-repeat center top; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; } .page_visual_title { color: #fff; padding: 70px 0 0 0; text-align: center; } @media screen and (min-width: 0em) and (max-width: 370px) { .page_visual_title { color: #fff; padding: 35px 0 0 0; text-align: center; } } @media screen and (min-width: 0em) and (max-width: 370px) { .page-visual { text-align: center; position: relative; display: -webkit-box; display: flex; width: 100%; height: 250px; margin-left: 0; margin-right: 0; margin-top: 30px; background: url(../tts_osaki/images/main_sp.jpg) no-repeat center top; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; } } @media screen and (min-width: 371px) and (max-width: 768px) { .page-visual { text-align: center; position: relative; display: -webkit-box; display: flex; width: 100%; height: 250px; margin-left: 0; margin-right: 0; margin-top: 30px; background: url(../tts_osaki/images/main_ip.jpg) no-repeat center top; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; } .page_visual_title { color: #fff; padding: 60px 0 0 0; text-align: center; } } /*--------------------footer--------------------*/ .l-footer { background: snow; text-align: left; } .l-footer__logo img { max-width: 180px; } .l-footer__menu { margin-top: 1rem; } .l-footer__menu ul > li a { color: #222; text-decoration: none; } .l-footer-copyright { /* font-family: serif;*/ text-align: center; background: #fff; padding-top: 1.1429rem; padding-bottom: 1.1429rem; } .l-footer-copyright p { margin-bottom: 0; font-size: 0.5rem; color: #000; } .container_footer { display: flex; flex-wrap: wrap; justify-content: space-around; align-content: stretch; background: #F5F8E7; color: #000; padding: 0 10% 0 10%; list-style-type: none; } .item_footer_1 { margin: 0; padding: 10px; width: 35%; } @media screen and (min-width: 559px) and (max-width: 959px) { .item_footer_1 { margin: 0; padding: 10px 0 0 30px; width: 50%; } } @media screen and (min-width: 0px) and (max-width: 559px) { .item_footer_1 { margin: 0; padding: 10% 18% 0 18%; width: 100%; } } .item_footer_2 { margin: 0; padding: 10px; width: 30%; } @media screen and (min-width: 560px) and (max-width: 959px) { .item_footer_2 { margin: 0; padding: 10px 0 0 30px; width: 50%; /* text-align: center;*/ } } @media screen and (min-width: 0px) and (max-width: 559px) { .item_footer_2 { margin: 0; padding: 10% 18% 0 18%; width: 100%; /* text-align: center;*/ } } .item_footer_3 { margin: 0; padding: 5%; width: 35%; min-height: 150px; vertical-align: middle; } @media screen and (min-width: 560px) and (max-width: 959px) { .item_footer_3 { padding: 5% 0 0 0; width: 100%; min-height: 150px;  margin: 0 auto; align: center; } } @media screen and (min-width: 0px) and (max-width: 559px) { .item_footer_3 { padding: 5% 30% 5% 5%; width: 100%; min-height: 150px;  margin: 0 auto; } } .item_footer_center { max-width: 50%; margin: 0 auto; } .image_footer_logo { width: 50px; height: 50px; margin: 5px; padding: 5px; } .center { height: 50px; width: 100%; text-align: center; margin: 10px 0 10px 0; } .footer_nav { margin-bottom: 10px; list-style-type: none; } .footer_nav ul { list-style-type: none; } .footer_nav ul li { list-style-type: none; } .footer_nav a { color: #432; padding: 10px; display: block; } .footer_nav a:hover { color:#0bd; } .map_container { width:100%; } .c-copyright { text-align: center; padding-top: 24px; font-size: 1.2rem; color: #000; } .c-copyright a{ color: #000; } .c-copyright a:hover{ color: #000; cursor: default; } /*--------------------layout--------------------*/ .l-container { max-width: 1080px; margin-left: auto; margin-right: auto; } .l-container.is-sm { max-width: 800px; margin-left: auto; margin-right: auto; } .l-wrapper { padding-left: 3vw; padding-right: 3vw; } .l-main { padding-top: 1vh; padding-bottom: 3vh; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .l-main { padding: 4vw; } } .l-main.is-two-columns { width: calc(100% - 320px); float: left; } .l-container.is-flex { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .l-container.is-flex { flex-wrap: wrap; } } .l-contents { max-width: 67%; width: 100%; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .l-contents { max-width: 100%; } } .l-aside { max-width: 29%; width: 100%; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .l-aside { max-width: 100%; } } .l-section { padding-top: 5.7143rem; padding-bottom: 5.7143rem; } /*--------------------post--------------------*/ .c-post-archive .hentry { display: -webkit-box; display: flex; width: 100%; margin-top: 3vh; padding-bottom: 3vh; border-bottom: 1px solid #ccc; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .c-post-archive .hentry { flex-wrap: wrap; } } .c-post-archive .hentry .entry-meta a { color: #999; text-decoration: none; } .c-post-archive .hentry .entry-content p { letter-spacing: 0; font-size: 12px; } .c-post-archive .hentry .entry-title { margin-top: 0; margin-bottom: 4px; font-size: 1.2857rem; padding-left: 0; padding-right: 0; background: none; } .hentry .entry-title a { text-decoration: none; color: #A0C653; -webkit-transition: all ease 0.2s; transition: all ease 0.2s; } .hentry .entry-title a:hover { text-decoration: underline; } .c-post-archive .hentry .hentry-thumbnail { flex-basis: 32%; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .c-post-archive .hentry .hentry-thumbnail { flex-basis: 100%; margin-bottom: 0.5714rem; } } .c-post-archive .hentry .hentry-content { flex-basis: 68%; padding-left: 2.0vw; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .c-post-archive .hentry .hentry-content { flex-basis: 100%; padding-left: 0; } } .screen-reader-text { border: 0; clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; word-wrap: normal !important; } .wp-block-latest-posts { padding-left: 0; } .wp-block-latest-posts li { display: flex; list-style: none; text-align: left; padding-top: 8px; padding-bottom: 8px; justify-content: space-between; border-bottom: 1px solid #e8e8e8; } .wp-block-latest-posts li a { display: inline-block; margin-right: 16px; } .wp-block-latest-posts li time { white-space: nowrap; } @media screen and (min-width: 0em) and (max-width: 39.9375em) { .wp-block-latest-posts li { display: block; } } .ggmap { position: relative; padding-bottom: 56.25%; padding-top: 30px; height: 0; overflow: hidden; } .ggmap iframe, .ggmap object, .ggmap embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }