/*common*/ h1 { color: #DD4B3A; font-size: 2.5rem; font-weight: bold; text-align: center; margin-bottom: 4.5rem; } h2 { font-size: 1.5rem; font-weight: bold; text-align: center; margin-bottom: 2rem; } h3 { font-size: 1.2rem; font-weight: bold; text-align: center; margin-bottom: 1rem; } .logo { width: 207px; height: 32px; background: url(../img/logo.png) no-repeat; background-size: 100%; white-space: nowrap; text-indent: 100%; overflow: hidden; } @media screen and (max-width:767px){ h1 { font-size: 1.5rem; margin-bottom: 1.5rem; } h2 { font-size: 1.2rem; margin-bottom: 1.2rem; } h3 { font-size: 1rem; margin-bottom: 1rem; } .logo { width: 180px; height: 28px; padding-top: 5.4%; } } .shadowbutton { box-shadow: 0 5px 3px rgba(190,180,95, .4); -ms-transition: all .2s; -webkit-transition: all .2s; transition: all .2s; } .shadowbutton:hover { box-shadow: none;transform: -ms-translateY(5px);transform: -webkit-translateY(5px);transform: translateY(5px); } .texture_red { background: url(../img/texture_red.png)!important; } .texture_yellow { background: url(../img/texture_yellow.png)!important; background-size: 100% auto; } /*home*/ .calendar { width: 114px; height: 140px;text-align: center; background: url(../img/calendar.png) no-repeat center center; background-size: 100% 100%; display: block; padding: 50px 0 0; font-family: 'five_minutesregular';} .calendar .year { font-family: inherit; font-size: 1.3rem; line-height: 100%; padding-bottom: 10px; display: block; background: url(../img/line-h.png) no-repeat bottom center; background-size: 50px auto;} .calendar .date { font-family: inherit; font-size: 2.2rem; line-height: 100%; display: block; margin-top: 10px; } @media screen and (max-width:767px){ .calendar { width: 57px; height: 70px; padding: 25px 0 0; } .calendar .year { font-size: .8rem; padding-bottom: 5px; background-size: 15px auto;} .calendar .date { font-size: 1.2rem; margin-top: 3px;} } #home .mainvisual { position: relative; } #home .mainvisual #treeimg { width: 100%; height: auto; min-height: 700px; text-align: center; position: relative; } #home .mainvisual #treeimg:before { content:''; width: 100%; height: 0; padding-bottom: 75%; display: block; } #home .mainvisual #treeimg img { width: auto; height: 100%; position: absolute; top:0; left: 0; right:0; bottom:0; margin: auto; display: inline-block; } #home .calendar { position: absolute; top: 110px; right: 10%;} #home .right-copy { width: 100px; height: 400px; background: url(../img/txt_tree_r.png) no-repeat; position: absolute; top: 270px; right: 11%; } #home .left-copy { width: 100px; height: 400px; background: url(../img/txt_tree_l.png) no-repeat; position: absolute; top: 270px; left: 10%; } #home .blog { padding: 35px 0 80px; background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-repeat:no-repeat, repeat-y; background-position:top center, top center; position: relative; -moz-animation-name: roots; -moz-animation-duration: 3s; -moz-animation-iteration-count: infinite; -webkit-animation-name: roots; -webkit-animation-duration: 3s; -webkit-animation-iteration-count: infinite; -o-animation-name: roots; -o-animation-duration: 3s; -o-animation-iteration-count: infinite; -ms-animation-name: roots; -ms-animation-duration: 3s; -ms-animation-iteration-count: infinite; animation-name: roots; animation-duration: 3s; animation-iteration-count: infinite; } @-webkit-keyframes roots { 0% { background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-position: top center, center 0; } 50% { background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-position: top center, center 806px; } 100%{ background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-position: top center, center 1612px ;} } @keyframes roots { 0% { background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-position: top center, center 0; } 50% { background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-position: top center, center 806px; } 100%{ background-image: url(../img/dot_red_s1.png), url(../img/line-v.png); background-position: top center, center 1612px ;} } @media screen and (max-width:767px){ #home .mainvisual #treeimg { min-height: 0; } #home .blog { background: none; -moz-animation-name: none; -webkit-animation-name: none; -o-animation-name: none; -ms-animation-name: none; animation: none;} } #home .blog .readmore { color:#FFF; text-align: center; width: 250px; padding: 1em 0; position: absolute; bottom:0 ; left:0; right:0; margin: auto; background:#E35260; border-radius: 10px; } #home .blog .readmore:before { content:url(../img/rightarrow.png); margin-right: 1rem; vertical-align: middle; } #home .news_area { width: 45%; margin-right: 10%; display: inline-block; vertical-align: top; } #home .diary_area { width: 45%; display: inline-block; vertical-align: top; margin-top: 50px; } #home .news_area .news_conts, #home .diary_area .diary_conts { width: 100%; height: auto; position: relative; border-radius: 10px; } #home .diary_area .diary_conts:before { content: ''; width: 15px; height: 15px; background: url(../img/dot_red_s1.png) no-repeat; position: absolute; top:0; bottom: 0; left: -11%; margin: auto; -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); } #home .news_area .news_conts { background: #BEB45F; margin-bottom: 40px; } #home .news_area .imgarea { width: 100%; height: auto; overflow: hidden; border-radius: 10px 10px 0 0; position: relative; background-size: cover; background-position: center center;} #home .news_area .imgarea:before { content:''; width: 100%; height:0; padding-bottom: 75%; display: block; } #home .news_area .news_conts:hover .imgarea:after { content:''; width: 100%; height: 0; padding-bottom: 100%; display: block; margin-top: -100%; background:rgba(206,195,125,.5);} #home .news_area .imgarea img { width: auto; height: auto; min-width: 100%; min-height: 100%; vertical-align: top; position: absolute; top:0; left:0; right:0; } #home .news_area .txtarea { width: 100%; height: auto; padding: 40px 25px; position: relative; } #home .news_area h3 { color: #FFF; margin-bottom: 0; } #home .news_area .date { color: #FFF; text-align: center; background: #CEC37D; width: 7rem; line-height: 100%; padding: 10px 0 8px; position: absolute; top: -10px; right: -10px; marign: auto; letter-spacing: .1em; font-family: 'five_minutesregular'; line-height: 100%; font-size: 1.3rem;} #home .diary_area .diary_conts{ background: #FFF; margin-bottom: 30px; zoom:1;/*for IE 5.5-7*/ } #home .diary_area .diary_conts:after{/*for modern browser*/ content:"."; display: block; height:0; clear: both; visibility: hidden; } #home .diary_area .diary_conts:hover .imgarea:after { content:''; width: 100%; height: 0; padding-bottom: 100%; display: block; margin-top: -100%; background:rgba(206,195,125,.5);} #home .diary_area .imgarea { width: 50%; height: auto; float: left; border-radius: 10px 0 0 10px; overflow: hidden; position: relative;} #home .diary_area .imgarea:before { content:''; width: 100%; height: 0; padding-bottom: 100%; display: block;} #home .diary_area .imgarea img { width: auto; height: auto; min-width: 100%; min-height: 100%; position: absolute; top:0; left:0; } #home .diary_area .imgarea { background-size: cover; background-position: center center; } #home .diary_area .txtarea { width: 50%; padding: 5%; float: right;} #home .diary_area h3 { text-align: left;} #home .diary_area h3 span { color: #FF0000; font-size: .8rem; display: block; } #home .diary_area .date { color: #FFF; text-align: center; background: #D6423D; width: 7rem; line-height: 100%; padding: 8px 0 6px; position: absolute; top: -10px; left: -10px; margin: auto; letter-spacing: .1em; font-family: 'five_minutesregular'; line-height: 100%; font-size: 1.3rem;} .writer { width: 80px; height: 80px; border: 1px solid #CEC37D; border-radius: 40px; position: absolute; margin: auto; display: block; background: #FFF;} #home .news_area .writer { top: -60px; left:0; right: 0; } #home .diary_area .writer { top: 100%; left:auto; bottom: 60px; right: -10px; } @media screen and (max-width:767px){ #home .mainvisual { padding-top: 120px; } #home .calendar { right: 5%; } #home .right-copy { top: 200px; right: 5%; -ms-transform: scale(.6); -webkit-transform: scale(.6); transform: scale(.6); -ms-transform-origin: top right;-webkit-transform-origin: top right; transform-origin: top right; } #home .left-copy { top: 150px; left: 5%; -ms-transform: scale(.6); -webkit-transform: scale(.6); transform: scale(.6); -ms-transform-origin: top left;-webkit-transform-origin: top left; transform-origin: top left;} #home .news_area { width: 100%; margin: 0; } #home .diary_area { width: 100%; margin-top: 0; } #home .news_area h3 { font-size: 1rem; } #home .diary_area h3 { font-size: 1rem; } .writer { width: 60px; height: 60px; } #home .news_area .writer { top: -40px; } #home .diary_area .writer { bottom: 40px; } #home .diary_area .diary_conts:before { content:none;} } /*apple*/ #apple .formality { width: 100%; margin-bottom: 100px;} #apple .formality li { width: 30%; margin-right: 5%; display: inline-block; vertical-align: top;} #apple .formality li:nth-child(3n) { margin-right: 0; } #apple .formality li img { width: 100%; margin-bottom: 1rem; } @media screen and (max-width:767px){ #apple .formality { margin-bottom: 50px;} #apple .formality li { width: 100%; margin-right: 0; margin-bottom: 50px; } } #apple .timeline { height: 2270px; position: relative; background: url(../apple/img/bg_timeline.png) repeat-y center top; margin-top: 50px; } /*一月当たりの高さ：450px*/ #apple *[data-month="aug"] { top: 0; } #apple *[data-month="sep"] { top: 450px; } #apple *[data-month="oct"] { top: 900px; } #apple *[data-month="nov"] { top: 1350px; } #apple *[data-month="dec"] { top: 1800px; } #apple *[data-month="jan"] { top: 2250px; display: none; } #apple *[data-month="feb"] { top: 2250px; } #apple .appleinfo[data-season="begining"] { margin-top: 0; } #apple .appleinfo[data-season="middle"] { margin-top: 150px; } #apple .appleinfo[data-season="late"] { margin-top: 300px; } #apple .timeline h3 { color: #B7AC52; line-height: 50px; width: 50px; height: 50px; border: 2px solid; display : block; border-radius: 25px; background: #FFF; position: absolute; left:0; right:0; margin: auto; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); } #apple .timeline h3 span { font-size: .7em; } #apple .timeline h3:nth-last-of-type(1):after { display:none; } #apple .timeline .note { width: 45%; font-size: .8rem; position: absolute; left:0; bottom: 0; margin: auto; display: inline-block; padding-left: 1em; text-indent: -1em; } #apple .appleinfo { width: 20%; text-align: center; display: inline-block; vertical-align: top; position: absolute; margin: auto; } #apple .appleinfo .conts_img { width: auto; height: auto; position: relative; padding: 2%;} #apple .appleinfo img { width: 100%; border-radius: 50%; border: 1px solid #A6A279; } #apple .appleinfo .conts_img:after { content:""; width: 100%; height:100%; background: url(../apple/img/frame_circle.png) no-repeat center center; background-size: 100% 100%; z-index:2; position: absolute; top:0; left:0; right:0; bottom: 0; dipslay: block;} /*#apple .appleinfo .conts_txt { position: relative; }*/ #apple .appleinfo h4 { font-weight: bold; margin-bottom: .5rem; margin-top: 1rem;} #apple .appleinfo h4 span { color: #DD4B3A; font-size: .8rem; display: block; } #apple .appleinfo p { text-align: left; } #apple .appleinfo span { font-size: .8em; display:block; } #apple .appleinfo button { color: #DD4B3A; font-size: .8rem; font-weight: bold; padding: 10px 25px; border: 1px solid #DD4B3A; margin: 1rem auto; display: inline-block; background: none; outline: none; cursor: pointer; overflow: hidden; -ms-transition: all .2; transition: all .2s; z-index: 2; position: relative; display: none;} /*#apple .appleinfo button:before { content:''; width: 100%; height: 100%; background:#DD4B3A; z-index: -1; position: absolute; top:0; right: 100%; -ms-transition: all .2; -webkit-transition: all .2s; transition: all .2s; }*/ #apple .appleinfo button:hover { color: #FFF; background: #DD4B3A; } /*#apple .appleinfo button:hover:before { right: 0; }*/ #apple .appleinfo .conts_txt .detail { display: none; padding: 10px; background: rgba(221, 75, 58, .8); width: 100%; height: auto; position: absolute; bottom:0; left: 0; z-index: 100; } #apple .appleinfo .conts_txt .detail .inner { width: 100%; height: auto; display: block; margin: auto; background: #FFF;} #apple .appleinfo .conts_txt .detail .inner .price { padding: 10px; } #apple .appleinfo .conts_txt .detail .inner .price dt { font-weight: bold; } #apple .appleinfo .conts_txt .detail .inner .price dd { color: #DD4B3A; font-size: 1.2rem; font-weight: bold; border-bottom: 1px solid #DD4B3A; margin-bottom: 10px; } #apple .appleinfo .conts_txt .detail .inner .price dd span { font-size: .8rem; display: inline; } #apple .appleinfo .conts_txt button.open + .detail { display: block; } #apple .timeline .appleinfo:nth-of-type(4n+1) { left: 0; } #apple .timeline .appleinfo:nth-of-type(4n+2) { right: 0; } #apple .timeline .appleinfo:nth-of-type(4n+3) { right: 25%; } #apple .timeline .appleinfo:nth-of-type(4n) { left:25%; } @media screen and (max-width:767px){ #apple *[data-month="aug"] { top: auto; } #apple *[data-month="sep"] { top: auto; } #apple *[data-month="oct"] { top: auto; } #apple *[data-month="nov"] { top: auto; } #apple *[data-month="dec"] { top: auto; } #apple *[data-month="jan"] { top: auto; } #apple *[data-month="feb"] { top: auto; } #apple .timeline { height: auto; background: url(../img/line-v.png) repeat-y center top; margin-top: 0; } #apple .timeline h3 { position: relative;-ms-transform: translateY(0); -webkit-transform: translateY(0); transform: translateY(0); } #apple .timeline h3 + h3 { margin-top: 1rem; } #apple .appleinfo[data-season="begining"] { margin-top: 0; } #apple .appleinfo[data-season="middle"] { margin-top: 0; } #apple .appleinfo[data-season="late"] { margin-top: 0; } #apple .appleinfo { width: 40%; position: relative; margin-bottom: 20px;} #apple .appleinfo button { padding: 10px; margin-top: 10px; } #apple .timeline .appleinfo:nth-of-type(4n+1) { left : 0; } #apple .timeline .appleinfo:nth-of-type(4n+2) { right: 0; margin-left: 20%; } #apple .timeline .appleinfo:nth-of-type(4n+3) { left: 0; right: auto; } #apple .timeline .appleinfo:nth-of-type(4n) { left: auto; right :0; margin-left: 20%; } #apple .timeline .note { width: 100%; top: 100%; margin-top: 1rem; } #apple .appleinfo .conts_txt .detail { width: 250%; } #apple .timeline .appleinfo:nth-of-type(even) .conts_txt .detail { right: 0; left: auto; } } /*about us*/ #us .conts_main p { margin-bottom: 1.5em;} #us .about_farm { width: 100%; padding-bottom: 20%; background: url(../us/img/bg_farm.png) no-repeat center bottom; background-size: 100% auto; } #us .about_family { width: 100%; margin-bottom: 100px; padding-bottom: 25%; background: url(../us/img/bg_family.jpg) no-repeat center bottom; background-size: 100% auto; } #us .family { width: 100%; } #us .family li { width: 23.5%; margin-bottom: 3rem; display: inline-block; text-align: center; vertical-align: top;} #us .family li:nth-child(-n + 3) { margin-right: 2%; } #us .family li:nth-child(4) { margin-right: 0; } #us .family li:nth-child(n+5) { margin-left: 7%; } #us .family figure { width: 100%; margin: 0;} #us .family .likeness { width: 100%; margin-bottom: 1rem; position: relative; padding: 5px; } #us .family .likeness img{ width: 100%; border-radius: 100%; background: #FFF; vertical-align: bottom;} #us .family .likeness:after { content:""; width: 100%; height: 100%; background: url(../us/img/frame_circle.png) no-repeat center center; background-size: 100% 100%; z-index:2; position: absolute; top:0; left:0; right:0; bottom: 0; display: block;} #us .family figcaption .name { font-size: 1.2rem; font-weight: bold; display: block; margin-bottom: .8rem; } #us .family figcaption .profile { font-size: .85rem; display: block; } #us #map { width: 100%; height: 400px; position:relative; } #us #map iframe { width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;} #us .access_info { width: auto; padding: 15px; background: #FFF; text-align: right; display: inline-block; position: absolute; top: 100%; right: 0 ; margin: auto; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); transform:translateY(-50%); } #us .access_info .head { font-size: 1rem; font-weight: bold; margin-bottom: 0; } #us .access { margin-top: 100px; } #us .link_googlemap { margin: 1rem 2rem; color: #DD4B3A; font-weight: bold; display: block; } #us .link_googlemap:before { content:''; width: .5rem; height: .5rem; border-top: 2px #DD4B3A solid; border-right: 2px #DD4B3A solid; display: inline-block; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); vertical-align: middle; margin-right: 1rem; } @media screen and (max-width:767px){ #us .about_farm { background-size: 160% auto; } #us .about_family { padding-bottom: 160px; background-size: auto 160px; margin-bottom: 50px; } #us .family li { width: 47%; } #us .family li:nth-child(odd) { margin-right: 6%; } #us .family li:nth-child(even) { margin-right: 0; } #us .family li:nth-child(n+5) { margin-left: 0; } #us .family .likeness { padding: 5px; } #us .family figcaption .profile { text-align: left; } #us .access { margin-top: 50px; } #us .access_info { position: relative; -ms-transform:translateY(0); -webkit-transform:translateY(0); transform:translateY(0); } #us .link_googlemap { margin: 0 5%;} } /*blog*/ #life .mainColumn { width: 85%; float:left; padding-left: 15%; } #life .subColumn { width: 15%; float:right; } #life .blog_conts { position: relative; margin-bottom: 100px; } #life .blog_conts.single_page { margin-bottom: 0; } #life .blog_conts .calendar { position: absolute; top: -30px; left: -30px; margin-bottom: 0; z-index: 10; } #life .blog_conts h3 { font-size: 2rem; font-weight: bold; text-align: left; padding-left: 100px; } #life .blog_conts h3 span { color: #F00; font-size: .9rem; font-weight: normal; line-height:120%; display: block; } #life .blog_conts .blog_conts_main img { max-width: 100%; height: auto; margin: 0 auto 2em; display: inline-block; } #life .blog_conts .blog_conts_main p img:not(.eyecatch) { margin-top: 2em; } #life .blog_conts p { line-height: 180%; } #life .blog_conts .eyecatch_wrap {margin-bottom: 1.5rem; position: relative; } #life .blog_conts .eyecatch { width: 100%; height:auto; vertical-align: bottom; } #life .blog_conts:not(.single_page) img:not(.eyecatch) { display: none; } #life .blog_conts .readmore_btn { color:#FFF; text-align: center; width: 250px; padding: 1em 0; display: block; margin: 2rem auto; background:#E35260; border-radius: 10px; } #life .blog_conts .readmore_btn:before { content:url(../img/rightarrow.png); margin-right: 1rem; vertical-align: middle; } #life .blog_conts .writer { z-index: 10; top: 130px; left: -30px; display: block!important;} #life .pager { margin-top: 50px; } #life .pager .prev { float: left; } #life .pager .next { float: right; } #life .pager a { color: #DD4B3A; font-weight: bold; } #life .pager .prev a:before, #life .pager .next a:after { content:''; width: 5px; height: 5px; border-top: 2px solid #DD4B3A; border-right: 2px solid #DD4B3A; display: inline-block; vertical-align: middle;} #life .pager .prev a:before { -ms-transform: rotate(-135deg); -webkit-transform: rotate(-135deg); transform: rotate(-135deg); marign-right: 10px;} #life .pager .next a:after { -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg);transform: rotate(45deg); marign-left: 10px;} #life .pagination { width: 100%; text-align: center; } #life .pagination li { width: 2em; height: 2em; margin: 0 ; display: inline-block; font-weight: bold; font-size: 1.2rem; line-height: 2em; text-align: center;} #life .pagination li.current { background:#DD4B3B; border-radius: 1em; } #life .pagination li .arrow_l, #life .pagination li .arrow_r { content:''; width: 1rem; height: 1rem; display: inline-block; border-width: 3px 0 0 3px; border-color: #101010; border-style: solid; vertical-align: middle; } #life .pagination li .arrow_l { -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); } #life .pagination li .arrow_r { -ms-transform: rotate(135deg); -webkit-transform: rotate(135deg); transform: rotate(135deg); } #life #subNavi { background: #FFF; padding: 20px; position: absolute; top: 250px; right: 0;} #life #subNavi h4 { color: #B7AC51; font-size: .8rem; margin-bottom: 1rem; } #life #subNavi ul { margin-bottom: 2rem; } #life #subNavi ul li { font-weight: bold; padding-bottom: .5rem; margin-bottom: .7rem; } #life #subNavi ul li:before { content:''; width: 15px; height: 15px; display: inline-block; vertical-align: middle; margin-right: .5rem; background: url(../img/dot_gold1.png) no-repeat center center; } #life #subNavi ul li:nth-child(odd):before { background: url(../img/dot_gold2.png) no-repeat center center; } #life #subNavi ul li:hover { background: url(../img/line-gold.png) no-repeat left bottom; -moz-animation-name: line; -moz-animation-duration: .2s; -webkit-animation-name: line; -webkit-animation-duration: .1s; -o-animation-name: line; -o-animation-duration: .1s; -ms-animation-name: line; -ms-animation-duration: .1s; animation-name: line; animation-duration: .1s; } @media screen and (max-width:767px){ #life .mainColumn { width: 100%; float:none; padding-left: 0; } #life .subColumn { width: 100%; float:none; } #life .blog_conts { margin-bottom: 100px;} #life .blog_conts.single_page { margin-bottom: 100px;} #life .blog_conts .calendar { left: -10px; top: -10px; } #life .blog_conts h3 { font-size: 1.2rem; padding-left: 60px; margin-bottom: .8rem;} #life .blog_conts .writer { top: 80px; left: -10px;} #life #subNavi { width: 90%; margin: 0 auto; position: relative; top: 0; right: auto; } #life .pagination { margin-bottom: 50px; } } /*contact*/ .contact_info { background: #FFF; padding: 30px; text-align: center; margin-bottom: 1rem;} /*.contact_info h3 { width: 100%; height: 3.5rem; background: url(../img/footer_msg.jpg) no-repeat top center; text-indent: 100%; white-space: nowrap; overflow: hidden; background-size: auto 100%; }*/ .contact_info + p { font-size: .8rem;} .contact_info + p:before { content: "\203B"; color: #DF4545; display: inline-block; margin-right: .5em; } .contact_info .telnum { display: inline-block; font-weight: bold; text-align: left;} .contact_info .telnum dt { font-size: .8rem; display: inline-block; vertical-align: middle; margin-right: 1em; } .contact_info .telnum dd { font-size: 2rem; display: inline-block; vertical-align: middle; } .contact_info .telnum dd:after { content: "\203B"; color: #DF4545; font-size: .5rem; vertical-align: top; line-height: 2rem; } .contact_info .fax, .contact_info .btn_contact, #thanks .btn_thanks { color: #FFF; padding: 1rem 3rem; background: #DD4B3A; display: inline-block; margin: 0 2rem; border-radius: 8px; } .contact_info .fax:before, .contact_info .btn_contact:before, #contact .btn_thanks:before { content:url(../img/rightarrow.png); margin-right: 1rem; vertical-align: middle; } #thanks .btn_thanks { margin: 50px auto 0; } #thanks .conts_main { text-align: center; } #contact .contact_info .btn_contact { display: none; } footer .contact_info .fax { display: none; } @media screen and (max-width:767px){ /* .contact_info h3 { height: 3rem; background: url(../img/footer_msg_sp.jpg) no-repeat top center; background-size: auto 100%; }*/ .contact_info p { text-align: left; font-size: .8rem; } .contact_info .telnum { width: 100%; text-align:center; margin: 1em auto 0; } .contact_info .telnum dt { font-size: .6rem; line-height: 120%; } .contact_info .telnum dd { font-size: 1.4rem; line-height: 120%; } .contact_info .telnum dd:after { line-height: 1.5rrem; } .contact_info .fax, .contact_info .btn_contact { width: 90%; margin: 1rem auto 0; padding: 1em 0; } } #error .conts_main h2 +p { margin-bottom: 50px; text-align: center;} #error .btn_to_home { color: #FFF; padding: 1rem 3rem; background: #DD4B3A; display: table; margin: 0 auto; border-radius: 8px; }