@media only screen and (min-width:1280px) { div.img-point-bg{width:640px;height:360px;padding-top: 0;} div.img-point-support{width:640px;height:360px;padding-top: 0;} } @media only screen and (max-width:414px) { article { margin-top: 60px; } article.scroll, article.scrolled { margin-top: 60px; } div#container { min-width: 100%; margin: 0; } body { font-size: 1.5rem; line-height: 2.6rem; height:100%; } /* ヘッダー */ #header { position: fixed; top:0; height:121px; background-color: #fff; z-index: 1000; -webkit-transition: all .4s ease-in-out 0s; transition: all .4s ease-in-out 0s; } #header #home{height:60px;} #header.active { height:100%; } #header #home #logo{width:75%;margin:14px 0px 0px 0px;} a.logo{width:90%;margin:0px 5% 0px 5%;} div#langnav{width:25%;height:60px;} div#langnav.active{background-position:-120px 0px;} div#langnav p{height:60px;line-height:60px;margin-left:12px;} div#langnav ul{text-align:left;} div#langnav ul li{margin-left:0;padding-left:15%;} div#langnav ul#lang{display:none;width:100%;height:81px;margin-left:-1px;overflow:hidden;} div#langnav.active ul#lang{display:block;} div#langnav.active{background-position:-94px 0px;} li.lang:first-child{border-top:1px solid #ced2d4;} li.lang:hover{background-position:0px -80px;} li.lang a{display:block;color:#282e33;width:100%;height:40px;padding:5px 12px 0px 0px;font-size:1.3rem;text-decoration:none;} div#hmenu { width: 32px; height: 32px; background: url(content/images/btn-menu.png) right top no-repeat; background-size: 100%; text-align:center; margin:14px auto 0; } div#hmenu.active { background: url(content/images/btn-menu-close.png) left top no-repeat; background-size: 100%; } div#globalnav { clear: both; position: absolute; top2: 60px; right: 0; width: 100%; height: 0px; overflow: hidden; z-index: 1000; opacity: 0.0; -webkit-transition: all .2s ease-in-out 0s; transition: all .2s ease-in-out 0s; } div#globalnav.active { top2: 0px; height: 100%; overflow: none; opacity: 1.0; background: rgba(255,255,255,1.0); -moz-transform: translateY(18px); -webkit-transform: translateY(18px); transform: translateY(18px); } #globalnav ul#nav { width: 100%; } div#globalnav.active ul#nav { border-top: 1px solid #ced2d4; } #globalnav ul#nav li { display:static; width: 50%; height:60px; line-height:60px; border: 0; border-bottom: 1px solid #ced2d4; margin:0; float:left; box-sizing: border-box; } #globalnav ul#nav li:last-child{clear:both;width:100%;text-align:center;border:0;} #globalnav ul#nav li:last-child a{text-align:left;margin:0 auto;} #globalnav ul#nav li:nth-child(even) { border-left: 1px solid #ced2d4; } #globalnav ul#nav li:last-child, #globalnav ul#nav li:last-child .fb-like{position:static;margin-top:20px;line-height:15px} #globalnav ul#nav li a{padding-bottom:5px;} /* ボディー */ #contents{margin-top:125px;text-align:center;} /* メイン(共通) */ h2.title{font-size:2.8rem;font-family:"NotoSansJP-Bold";margin:160px 0 00px 0;} h3.title{font-size:2.4rem;font-family:"NotoSansJP-Bold";} h4.title{font-size:2.0rem;font-family:"NotoSansJP-Bold";} h5.title{font-size:1.6rem;font-family:"NotoSansJP-Bold";} .col-1, .col-1-60{width:90%;padding:0 5%;} .col-2 div.odd, .col-2 div.even, .col-3 div.one, .col-3 div.two, .col-3 div.three {float:none;width:100%;} .col-2 div.even{border-left:0px;} .col-3 div.two{border:0px;} /* タブメニュー */ ul#tabs-navi { zoom: 1; font-size:0; display: block; list-style: none; margin: 40px 0 70px; padding: 0; width: 100%; text-align:left; } ul#tabs-navi:after { content: "."; display: block; height: 0px; clear: both; line-height: 0; visibility: hidden; } ul#tabs-navi li { display: inline-block; width: 50%; max-width:auto; height: 60px; font-size: 1.5rem; margin-top: -1px; box-sizing: border-box; } ul#tabs-navi li a { color: #282e33; font-family:"NotoSansJP-Bold"; line-height: 60px; display: block; width: 100%; height: 60px; text-decoration: none; } ul#tabs-navi li:first-child { border-left: 0px; border-top-left-radius:0px; border-bottom-left-radius:0px; } ul#tabs-navi li:nth-child(even) { border-right:0px; } ul#tabs-navi li:last-child { border-top-right-radius:0px; border-bottom-right-radius:0px; } .tabbox { display: none; } ul#tabs-navi li a.active { color: #fff; background-color: #282e33; } div#tabs { margin-top: 15px; } div#tabs h3 { margin-bottom: 70px; } /* アンカーメニュー */ ul#anchors-navi { zoom: 1; font-size:0; display: block; list-style: none; width: 100%; margin: 40px auto 70px; padding: 0; } ul#anchors-navi:after { content: "."; display: block; height: 0px; clear: both; line-height: 0; visibility: hidden; } ul#anchors-navi li { display: inline-block; width: 100%; height: 60px; line-height: 60px; font-size: 1.5rem; margin-top: -1px; } ul#anchors-navi li:first-child { border-left: 0px; border-top-left-radius:0px; border-bottom-left-radius:0px; } ul#anchors-navi li:last-child { border-top-right-radius:0px; border-bottom-right-radius:0px; } ul#anchors-navi li { border-right:0px; } /* TOP */ /* スライドイメージ */ div#caption { width: 100%; } #caption, .sp-slides, .sp-slide, .sp-mask, .sp-image-container, .sp-image{ height:240px!important;} p.sp-layer{font-size:2.0rem!important;line-height:3.0rem!important;text-align:center;padding:10px 20px} .sp-buttons { padding-top: 5px!important; border-bottom: 1px solid #2c2c33; } /* 会社案内 */ /* 代表紹介 */ #company-intro{width:100%;} #company-intro-col1{width:100%;height:100%;margin-right:0px;text-align:center;float:none;} #company-intro-col2{width:100%;height:100%;line-height:3.1rem;text-align:left;margin-top:50px;margin-left:0px;padding-left:0px;} #company-intro-img{width:100%;height:0;padding-top:118.75%;background:url(content/images/img-company-intro-img.jpg) left top no-repeat;background-size:100%;} #company-intro-name{border:2px solid #282e33;margin:25px 0 20px;padding:10px 14px 14px;} #company-intro-name p.name{font-size:3.0rem;line-height:4.4rem;font-family:"NotoSansJP-Bold";} #company-intro-name p.title{font-size:1.7rem;font-family:"NotoSansJP-Bold";} #company-intro-desc{font-size:1.3rem;line-height:2.5rem;} #company-intro-desc p{text-align:left;} #company-intro-col2 p.sig{text-align:right;} /* 会社沿革 */ div#company-history{width:100%;margin-top:0px;text-align:left;background:url(content/images/img-company-history-line.png) 26.2% 25% no-repeat;background-size:4px 90%;} div#company-history dl{width:100%;display:table;margin-top:30px;} div#company-history dl dt{width:30%;min-height:32px;line-height:2.5rem;padding:8px 0;text-align:left;display:table-cell;vertical-align:middle;background:url(content/images/img-company-history.png) right 50% no-repeat;background-size:24px;} div#company-history dl:last-child dt{background:url(content/images/img-company-history-new.png) right 50% no-repeat;background-size:24px;} div#company-history dl dd{width:70%;min-height:32px;line-height:2.5rem;padding:8px 0 8px 20px;text-align:left;font-family:"NotoSansJP-Regular";display:table-cell;} /* 会社概要 */ div#company-outline{width:100%;overflow:hidden;display:table;} div#company-outline-img{display:none;} div#company-outline-list{display:table-cell;padding-left:0px;} div#company-outline-list dl{width:100%;display:table;border-bottom:1px dotted #ced2d4;} div#company-outline-list dl dt{width:30%;line-height:2.5rem;padding:18px 0;text-align:left;font-family:"NotoSansJP-Bold";display:table-cell;vertical-align:top;} div#company-outline dl dd{width:70%;line-height:2.5rem;padding:18px 0 18px 0px;text-align:left;font-family:"NotoSansJP-Regular";display:table-cell;} /* アクセス */ div#company-access{text-align:left;} div#company-access-map{width:96%;height:300px;padding:2%;border:1px solid #ced2d4;} div#company-access-map iframe{width:100%;height:100%;} div#company-access-desc{margin-top:30px;} /* サービス */ div#services-line .col-2 div{min-height:50px;margin-bottom:30px;} /* サポート実績 */ /* クライアント */ div.results-clients{text-align:left;} div.results-clients ul{width:100%;} div.results-clients ul li{width:95%;margin:4px 0% 4px 5%;line-height:2.5rem;float:none;} div.results-clients p{margin-top:16px;text-align:right;} div.results-clients p.desc{text-align:left;} /* イベント */ div#past dl {display:table;width:100%;border-bottom:1px solid #ced2d4;} div#past dl dt, div#past dl dd{display:table-cell;text-align:left;padding:12px 8px;} div#past dl dt{width:45%;font-family:"NotoSansJP-Bold";} /* メンバー */ div#members-container{width:100%;margin-top:30px;} div.member-box{width:100%;margin-top:30px;margin-right:0%;} div.member-img{width:97%;height:290px;margin:0 0 20px 0;overflow:hidden;float:none;} div.member-img img{width:100%;height:auto;} div.member-desc dl dt{width:23%;} /* 顧問先優待 */ #partners-container{width:100%;margin-top:30px;} .partner-box{width:100%;margin-right:0%;margin-top:5%;border:1px solid #ced2d4;text-align:left;float:none;} .partner-box p.title{font-family:"NotoSansJP-Bold";padding:14px 18px 2px;} .partner-box p.desc{padding:2px 18px 14px;} /* お問い合わせ */ div#contact-container .col-2 .odd{width:100%;padding-right:0%;} div#contact-container .col-2 .even{width:100%;padding-left:0%;} textarea#message{font-size:1.6rem;line-height:2.4rem;height:240px;margin-top:10px;} /* ページ */ div#pagetop { position: fixed; bottom: 20px; right: 18px; width: 52px; height: 52px; border-radius: 26px; /* CSS3草案 */ -webkit-border-radius: 26px; /* Safari,Google Chrome用 */ -moz-border-radius: 26px; /* Firefox用 */ } div#pagetop p { display: block; width: 52px; height: 52px; opacity: 0.7!important; } /* フッター */ div#wrapper { padding-bottom: 164px; /*内フッターの上マージン70px*/ } #footer { clear: both; position: absolute; bottom: 0px; width: 100%; height: 90px; margin:0 auto; text-align:center; border-top:4px solid #282e33; } #footernav{margin-top:0px;} #footernav ul{display:none;} #footernav ul li{margin-left:30px;list-style:none;display:inline;line-height:38px;} #footernav ul li:first-child{margin-left:0px;} #footernav ul li:last-child{display:block;margin-left:0;} #footernav ul li a{color:#282e33;font-family:"NotoSansJP-Regular";font-size:1.3rem;text-decoration:none;padding-bottom:6px;border-bottom:1px solid #fff;} #footernav ul#nav li a.hover, #footernav ul#nav li a.active{padding-bottom:6px;border-bottom:1px solid #282e33;} .copyright{font-size:1.3rem;margin-top:20px;} } @media only screen and (max-width:375px) { h2.title span.jp { display: block; } }