/* Theme Name: HOUSAKU Author: HOUSAKU Project, Inc.contents/report Author URI: http://www.housaku.net/ Version: 1.0.5 Tags: two-columns, responsive-layout License: GNU General Public License v2.0 License URI: http://www.gnu.org/licenses/gpl-2.0.html Description: 豊作プロジェクト株式会社 Theme URI: http://www.housaku.net/ */ @charset "utf-8"; /** * CSS Reset */ html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend, caption { margin: 0; padding: 0; } table, th, tr, td, tbody, tfoot, thead { margin: 0; padding: 0; } h1, h2, h3, h4, h5, h6 { font-size: 100%; } ol, ul { list-style:none; } fieldset, img { border:0; } table { border-collapse: collapse; border-spacing:0; } caption, th { text-align: left; } address, caption, cite, code, dfn, em, th, var { font-style: normal; font-weight: normal; } a, a:link, a:visited, a:hover, a:active { text-decoration:none } // Bootstrap 対応 @-webkit-viewport { width: device-width; } @-moz-viewport { width: device-width; } @-ms-viewport { width: device-width; } @-o-viewport { width: device-width; } @viewport { width: device-width; } /** * WordPress が生成するクラス */ .aligncenter, div.aligncenter { display: block; margin-left: auto; margin-right: auto; } .alignleft { float: left; } .alignright { float: right; } .wp-caption { border: 1px solid #ddd; text-align: center; background-color: #f3f3f3; padding-top: 4px; margin: 10px; /* optional rounded corners for browsers that support it */ -moz-border-radius: 3px; -khtml-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .wp-caption img { margin: 0; padding: 0; border: 0 none; } .wp-caption p.wp-caption-text { font-size: 11px; line-height: 17px; padding: 0 4px 5px; margin: 0; } .gallery-caption { font-size: 90%; } .sticky .entry-date { display: none; } .bypostauthor { } /** * 共通 */ body { font-family: Helvetica, Arial, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif; } /* 全体 *****************************************************************/ /* 全体的に********************************************/ /*body----------*/ p{ margin-bottom: 1em; } #main_contents{ padding-top: 15px; padding-left: 1em; padding-right: 1em; background-color: #fff; } .top_catch_add{ background-color: #fff; } body { margin : 0 auto; padding : 0; font : 12px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; color : #666; } #top_catch_inner{ padding-bottom: 0; } .pageTop { text-align: right; margin: 0px auto 30px; } /* indexで背景の調整 */ #main_contents{ background: url(/images/common/base/contents_bg.jpg) 0 0 repeat-x; } /* 全体的なレスポンシブ部分を記述 */ /* md */ @media screen and (min-width: 985px) { .navi_content img{ padding-top: 0px; } #header{ background: url(/images/common/base/bg_01.gif) repeat-x; } #content_top_catch{ background: url(/images/common/base/mv_bg_in.gif) repeat-x; border-bottom: solid 1px #dcdcdc; } #top_catch #image-navigation { margin-bottom: 0 !important; padding-top :0px; } #g_menu{ margin-top: -1px !important; } .navi-menu{ margin-left: 10px; } #header h1 br{ display: none; } #header .hr_top{ padding-top: 2px; } .w100p-img{ width: 100%; } } /* sm */ @media screen and (max-width: 985px) { #header{ background: url(/images/common/base/all-bg-top-sm.gif) repeat-x; } #content_top_catch{ background: url(/images/common/base/mv_bg_in_xs.gif) repeat-x; border-bottom: solid 1px #dcdcdc; } #header .h_info img{ margin-top: -10px; padding-bottom: 10px; } #header .hr_top{ text-align: right; } .navi_content img{ padding-bottom: 9px; } .navi_content img{ padding-top: 0px; } #header .hr_top{ margin-top: 0; } #header .h_info{ margin-top: 10px; } #header h1 br{ display: none; } #footer .searchform{ margin-top: 10px; } #footer .search_area{ vertical-align: top; } #footer p.text-right { margin-right: 0 !important; } .img-in{/* スラスラ系の背景枠とあわせるため差し替えたイメージを小さく表示する */ width: 98%; margin-left: auto; margin-right: auto; } .sm100p{/* 画像をはみ出させないように指定 */ width: 100%; } .w100p-img{ width: 100%; } } /* xs */ @media screen and (max-width: 720px) { #header{ background : none; } #content_top_catch{ background: none; border-bottom: solid 1px #dcdcdc; } #header .hr_top{ margin-top: 3px; } .w100p-img{ width: 100%; } /* xs時のinner-contents幅指定　ちょっと中に入れる */ #main { padding-left: 0 !important; } #header .header-title{ margin-right: 10px; } #top_catch #image-navigation { margin-bottom: 0 !important; padding-top : 2px; } .main_contents-bottom{ margin-top: -10px !important; } #top_catch{ background: none !important; margin: 0 10px 0 10px; } .nav-xs { margin-left: 15px; margin-right: 15px; margin-top: 1em; margin-bottom: 1em; border: solid 1px #ccc; border-radius: 4px; background-color: #f3f3f3; } .nav-xs h1 { padding: 1.3em 1em 1em 1em; } #main { padding-left: 0; margin-bottom: 20px !important; } /* モバイル時ナビゲーションのＣＳＳ */ .sidr ul li a, .sidr ul li span { padding: 0 20px; } .sidr ul li a img{ vertical-align: middle; } .sidr ul li ul li{ line-height: 30px; padding-left: 40px; padding-right: 10px; } .sidr ul li ul li:hover{ line-height: 30px; padding-left: 40px; padding-right: 10px; } .sidr form { margin: 0 15px; margin-top: 15px; } } /* パンくずリストの幅を変更するＣＳＳ */ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .p_list { width: 700px !important; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .p_list { width: 500px !important; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .p_list { width: 350px !important; } } /* 全体的な背景まわり ******************************/ .nav-area ul{ margin-left: auto; margin-bottom: auto; } #top_catch{ background: url(/images/common/base/mv_bg.gif) repeat-x; } #footer .footer-up{ background-color: #f3f3f3; background-image: url(/images/common/base/footer-up-bg.gif); background-repeat: repeat-x; } #main-all-bg{ background: url(/images/common/base/contents_bg.jpg) 0 0 repeat-x; padding-top: 30px; } /* smにのみナビゲーションにボーダーをつける */ @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ #header{ border-bottom: solid 1px #d3d3d3; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ #header{ border-bottom: none; } } /* サイドの中ページのリストの装飾 */ #side .cont_nav_box { margin-bottom: 30px; text-align: left; } #side .cont_nav_box{ position:relative; -webkit-box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; -moz-box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; } #side .nav01:before, #side .nav01:after{ content:""; position:absolute; z-index:-1; -webkit-box-shadow:0 0 10px rgba(0,0,0,0.8); -moz-box-shadow:0 0 10px rgba(0,0,0,0.8); box-shadow:0 0 10px rgba(0,0,0,0.8); top:50%; bottom:0; left:8px; right:8px; } #side .nav01:after{ right:10px; left:auto; -webkit-transform:skew(8deg) rotate(3deg); -moz-transform:skew(8deg) rotate(3deg); -ms-transform:skew(8deg) rotate(3deg); -o-transform:skew(8deg) rotate(3deg); transform:skew(8deg) rotate(3deg); } #side .nav01{ background-color: #fff; } #side .nav01 dl{ margin-bottom: 0; } #side .nav01 dl dt{ background: #f5f5f5; /* Old browsers */ background: -moz-linear-gradient(top, #f5f5f5 1%, #ffffff 35%, #ffffff 35%, #f5f5f5 35%, #f5f5f5 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#f5f5f5), color-stop(35%,#ffffff), color-stop(35%,#ffffff), color-stop(35%,#f5f5f5), color-stop(100%,#f5f5f5)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* IE10+ */ background: linear-gradient(to bottom, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#f5f5f5',GradientType=0 ); /* IE6-9 */ border: solid 1px #d3d3d3; border-collapse: collapse; overflow: hidden; margin-top: -1px; } #side .nav01 dl dd{ background-color: #eeeeee; border-bottom: dotted 1px #a9a9a9; border-left: solid 1px #d3d3d3; border-right: solid 1px #d3d3d3; overflow: hidden; /*background: url(/images/common/menu/sm-nav-in-index.png) no-repeat;*/ } #side .nav01 dl a{ display: block; zoom: 1; /* IE6以前に対応 */ } #side .nav01 dl a>span{ text-decoration: underline !important; } #side .nav01 dl a{ font-weight:normal; } #side .nav01 dl a:hover{ text-decoration: none; } #side .nav01 dl dt img{ float: right; padding-left: 0.6em; border-left: dotted 1px #999; } #side .nav01 dl dd img{ margin-right: 0.5em; } #side .nav01 dl dt a:hover{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #side .nav01 dl>dt>a>div{ padding: 1em 1em 1em 1.3em; } /* smの時だけサイドバーの文字幅固定する */ @media screen and (min-width: 985px) { #side .nav01 dl>dt>a>div>span{ width: 85%; } } @media screen and (max-width: 985px) { #side .nav01 dl>dt>a>div>span{ width: 110px; } } @media screen and (max-width: 720px) { #side .nav01 dl>dt>a>div>span{ width: 80%; } } #side .nav01 dl>dt>a>div>span{ padding-right: 0.5em; margin-right: 0; display: block; float: left; text-decoration: underline; } #side .nav01 dl>dt>a>div>span.no-padding{ padding-right: 0; } #side .nav01 dl dd a{ padding: 0.7em 1em 0.7em 2em; } #side .nav01 dl dd a:hover{ color: #fff; background-color: #317f00; } #side .nav01 dt.ac01 a{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #side .nav01 dd.ac02 a{ color: #fff; background-color: #317f00; } #side .nav01 dt.ac03 a{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } /* 中に入ったときのサイドバーのナビゲーション「英語に自信のない入門者の皆さま」の改行と文字の大きさを指定する */ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .cont_nav-kaigyou br{ display: none; } .cont_nav-kaigyou{ font-size: 11px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .cont_nav-kaigyou br{ display: inline; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .cont_nav-kaigyou br{ display: none; } } /*清水追加CSS*/ audio { width: 90%; } #main{ padding-left: 16px; margin-bottom: 50px; } img{ max-width: 100%; } .m-bottom10{ margin-bottom: 10px; } .m-bottom20{ margin-bottom: 20px; } .m-bottom30{ margin-bottom: 30px; } .m-top10{ margin-top: 10px } .m-top20{ margin-top: 20px } .m-top30{ margin-top: 30px } .width40{ width: 40%; } .valign-t{ vertical-align: top; } .valign-b{ vertical-align: bottom; } #main .width90p{ width: 90%; margin-left: auto; margin-right: auto; } #main .width95p{ width: 95%; margin-left: auto; margin-right: auto; } .m-right-6 form input[type=image]{/* 画像の端をそろえるためにformのボタンのマージンを調整（画像に白が入っているため） */ margin-right: -6px !important; } a:-webkit-any-link { color: -webkit-link; text-decoration: underline; cursor: auto; } a:link, a:visited { color: #3a99ce; text-decoration: underline; } a:hover, a:active { color: #3a99ce; text-decoration: none; } .border_bottom { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px #999 dotted; } .point_arr a { display : block; background : url(/images/common/icon/icon02.png) 0 5px no-repeat; padding-left : 20px; } /* 全体を通してある続きを読むの位置調整 */ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .tsuzuki-yomu{ text-align: left; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .tsuzuki-yomu{ text-align: right; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .tsuzuki-yomu{ text-align: right; } } /** 改行.テキストアライン関係 *******************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ /* h2にモバイルの時のみ改行を入れる */ .title-br{ display: none; } /* PC(md)のみ改行を入れる */ .md-br br{ display: inline; } /* タブレット(sm)のみ改行を入れる */ .sm-br br{ display: none; } /* タブレット(xs)のみ改行を入れる */ .xs-br br{ display: none; } /* タブレットsmとモバイルxsを改行する時のクラス */ .xssm-br br{ display: none; } /* dm,lg→右寄せ　sm,xs→左寄せ */ .text_rll{ text-align: right; } /* PCだけ改行する */ .md-br br{ display: inline; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .title-br{ display: none; } .md-br br{ display: none; } .sm-br br{ display: inline; } .xs-br br{ display: none; } .xssm-br br{ display: inline; } .text_rll{ text-align: left; } .md-br br{ display: none; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .title-br{ display: inline; } .md-br br{ display: none; } .sm-br br{ display: none; } .xs-br br{ display: inline; } .xssm-br br{ display: inline; } .text_rll{ text-align: left; } .md-br br{ display: none; } } #main_one_column h2 { border: solid 1px #d3d3d3; border-top: solid 2px #006400; color: #333; font-weight: bold; font-size: 1.8em; padding: 0.5em 0.8em; margin-bottom: 1em; margin-top: 20px; box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; -webkit-box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; -moz-box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; } #main_one_column h2 { border: solid 1px #d3d3d3; border-top: solid 2px #006400; color: #333; font-weight: bold; font-size: 1.8em; padding: 0.5em 0.8em; } .clear{ margin-top: 20px; } /* ４０４エラーのページ *****************************************************/ #content404{ padding-bottom: 40px; } #content404 h1{ display: block; font-size: 2em; -webkit-margin-before: 0.67em; -webkit-margin-after: 0.67em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; font-weight: bold; margin-bottom: 1em } /* header **********************************************************/ /* 固定ページの見出しの調整 *************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ #top_catch { clear : both; width : inherit; height : 347px; text-align:left; background : url(/images/common/base/mv_bg.gif) 0 0 repeat-x; } #content_top_catch { clear : both; width : inherit; height : inherit; background : url(/images/common/base/mv_bg02.gif) left bottom repeat-x; } #content_top_catch .inner { width : 982px; margin : 0 auto; position : relative; } #content_top_catch h1, #content_top_catch p { line-height: 1.5em; padding : 0px; margin : 0px; font-size : 12px; font-weight : normal; color : #CCC; position : absolute; left : 32px; top : 85px; width : 540px; } .side-habachosei{ width: 223px; margin-left: auto; margin-right: auto; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ #top_catch { clear : both; width : inherit; height : auto; text-align:left; background : url(/images/common/base/mv_bg.gif) 0 0 repeat-x; } #content_top_catch { clear : both; width : inherit; height : inherit; } #content_top_catch .inner { width : auto; margin : 0 auto; position : static; padding-top: 2px; } #content_top_catch h1, #content_top_catch p { line-height: 1.5em; padding : 0px; margin : 10px auto 10px 20px; color: #333 !important; font-size : 13px; font-weight : normal; color : #CCC; position : static; width : auto; } .side-habachosei{ width: 162px; margin-left: auto; margin-right: auto; } .amazon_area { width: 162px; } .amazon_area img { width:80%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .navbar .navbar-header .navbar-toggle { float: left; margin-left: 5px; } #top_catch { clear : both; width : inherit; height : auto; text-align:left; background : url(/images/common/base/mv_bg.gif) 0 0 repeat-x; } #content_top_catch { clear : both; width : inherit; height : inherit; background : none; } #content_top_catch .inner { width : auto; margin : 0 auto; position : static; padding-top: 2px; } #content_top_catch h1, #content_top_catch p { line-height: 1.5em; padding : 0px; margin : 10px 10px 10px 20px; color: #333 !important; font-size : 13px; font-weight : normal; color : #CCC; position : static; width : auto; } .side-habachosei{ width: auto; margin-left: auto; margin-right: auto; } .amazon_area { width:223px; } .amazon_area img { width:auto; } } #header h1{ display: block; font-size: 0.95em; -webkit-margin-before: 0.67em; -webkit-margin-after: 0.67em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; margin-left: 10px; margin-top: 10px; } #header .header-title{ margin-top: 5px; margin-bottom: 2px; } #header{ margin-bottom: 0; } #header .header-top{ margin-bottom: 8px; } #header .h_info .h03{ margin-top: 6px; margin-right: 10px; } #header .h_info .h02{ margin-top: 20px; margin-right: 10px; } #header .h_info .h01{ margin-top: 23px; } #header #main-contents{ padding-bottom: 30px } #index-all-bg{ margin-top: 20px; } /* 法人のお客様へ、検索の位置 */ #header .hr_top a { float: left; width: 192px; display: block; margin-right: 0px; } #header .hr_top .search_area { width: 190px; height: 25px; border: 1px #CCC solid; vertical-align: top; margin-right: 3px; } /* xs時ヘッダーのnavに入れた検索フォーム */ #bs-example-navbar-collapse-1 input[type="image"]{ margin-bottom: -9px; } #bs-example-navbar-collapse-1 .searchform{ padding-top: 7px; } /* header ナビゲーション部分　**************************************/ /* 元ソースより追加(menu.css) */ /* ナビ部分　ブートストラップでつくpadding消し */ .list-inline>li { display: inline-block; padding-left: 0; padding-right: 0; } /* md,lgの時のnav */ /* LEVEL ONE */ ul.dropdown { position: relative; } ul.dropdown li { float: left; zoom: 1; } ul.dropdown a:hover { color: #000; } ul.dropdown a:active { color: #ffa500; } ul.dropdown li a { display: block; } ul.dropdown li:last-child a { border-right: none; } /* Doesn't work in IE */ ul.dropdown li.hover, ul.dropdown li:hover { color: black; position: relative; } ul.dropdown li.hover a { color: black; } /* LEVEL TWO */ ul.dropdown ul { width:345px; visibility: hidden; position: absolute; top: 45px; left: 0; z-index:2; background:url(/images/common/base/pd_menu/pd_bot.png) left bottom no-repeat; padding-bottom:20px!important; } ul.dropdown ul li { font-weight: normal; color: #000; float: none; } /* IE 6 & 7 Needs Inline Block */ ul.dropdown ul li a { border-right: none; width: 100%; display:block; background:url(/images/common/base/pd_menu/pd_bg_off.png) 0 0 no-repeat; width:324px; height:27px; text-align:left; padding:13px 0px 0px 21px; color:#333!important; } ul.dropdown ul li a:hover { background:url(/images/common/base/pd_menu/pd_bg_on.png) 0 0 no-repeat; color:#FFF!important; } ul.dropdown ul li.pd_menu_top a { background:url(/images/common/base/pd_menu/pd_top_off.png) 0 0 no-repeat; width:324px; height:27px; text-align:left; padding:17px 0px 0px 21px; color:#FFF; } ul.dropdown ul li.pd_menu_top a:hover { background:url(/images/common/base/pd_menu/pd_top_on.png) 0 0 no-repeat; } ul.dropdown li.ddm02 ul { width:250px; visibility: hidden; position: absolute; top: 45px; left: 0; z-index:2; background:url(/images/common/base/pd_menu/pd02_bot.png) left bottom no-repeat; padding-bottom:20px!important; } ul.dropdown li.ddm03 ul { left: -55px; } ul.dropdown li.ddm04 ul { width:345px; visibility: hidden; position: absolute; top: 45px; left: 0; z-index:2; background:url(/images/common/base/pd_menu/pd_bot.png) left bottom no-repeat; padding-bottom:20px!important; } ul.dropdown ul li { font-weight: normal; color: #000; float: none; } /* IE 6 & 7 Needs Inline Block */ ul.dropdown li.ddm02 ul li a { border-right: none; width: 100%; display:block; background:url(/images/common/base/pd_menu/pd_bg02_off.png) 0 0 no-repeat; height:40px; text-align:left; padding:13px 0px 0px 21px; color:#333!important; } ul.dropdown li.ddm02 ul li a:hover { background:url(/images/common/base/pd_menu/pd_bg02_on.png) 0 0 no-repeat; color:#FFF!important; } ul.dropdown li.ddm02 ul li.pd_menu_top a { background:url(/images/common/base/pd_menu/pd_top02_off.png) 0 0 no-repeat; height:44px; text-align:left; padding:17px 0px 0px 21px; color:#FFF; } ul.dropdown li.ddm02 ul li.pd_menu_top a:hover { background:url(/images/common/base/pd_menu/pd_top02_on.png) 0 0 no-repeat; } ul.dropdown li.ddm04 ul li a { background:url(/images/common/base/pd_menu/pd_bg_off.png) 0 0 no-repeat; } ul.dropdown li.ddm04 ul li a:hover { background:url(/images/common/base/pd_menu/pd_bg_on.png) 0 0 no-repeat; } ul.dropdown li.ddm04 ul li.pd_menu_top a { background:url(/images/common/base/pd_menu/pd_top_off.png) 0 0 no-repeat; } ul.dropdown li.ddm04 ul li.pd_menu_top a:hover { background:url(/images/common/base/pd_menu/pd_top_on.png) 0 0 no-repeat; } /* LEVEL THREE */ ul.dropdown ul ul { left: 100%; top: 0; } ul.dropdown li:hover > ul { visibility: visible; } /* smの時のnav */ #top #header .nav-sm{ border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; } .nav-sm .dropdown-menu>li>a { padding-top: 7px; padding-bottom: 7px; font-size: 0.83em; } .nav-sm .dropdown-menu>li { border-bottom: solid 1px #a9a9a9; overflow: hidden; } .nav-sm .dropdown-menu li .nav-in-yaji{ float: right; margin-bottom: 5px; display: inline-block; width: 16px; } .nav-sm .navbar-nav>li { padding: 0; border: solid 1px #CCC; border-top: solid 3px #888; font-weight: bold; } .nav-sm .navbar1 .navbar-nav>li>ul,.nav-sm .navbar2 .navbar-nav>li>ul{ border-bottom: solid 10px #666; } .nav-sm .navbar-nav>li>a{ padding: 10px 45px; background: url(/images/common/menu/sm-nav-bg.jpg) repeat-x; } .nav-sm .navbar1 .navbar-nav>li:nth-child(1)>a{ padding-right: 15px; padding-left: 15px; } .nav-sm .navbar1 .navbar-nav>li:nth-child(2)>a{ padding-right: 57px; padding-left: 57px; } .nav-sm .navbar1 .navbar-nav>li:nth-child(2)>ul{ width: 240px; } .nav-sm .navbar1 .navbar-nav>li:nth-child(3)>a{ padding-right: 56px; padding-left: 56px; } .nav-sm .navbar1 .navbar-nav>li:nth-child(3)>ul{ width: 240px; } .nav-sm .navbar1 .navbar-nav>li:nth-child(4)>a{ padding-right: 57px; padding-left: 57px; } .nav-sm .navbar1 .navbar-nav>li:nth-child(4)>ul{ width: 220px; } .nav-sm .navbar2 .navbar-nav>li:nth-child(1)>a{ padding-right: 58px; padding-left: 58px; } .nav-sm .navbar2 .navbar-nav>li:nth-child(1)>ul{ width: 310px; } .nav-sm .navbar2 .navbar-nav>li:nth-child(2)>a{ padding-right: 56px; padding-left: 56px; } .nav-sm .navbar2 .navbar-nav>li:nth-child(2)>ul{ width: 250px; } .nav-sm .navbar2 .navbar-nav>li:nth-child(3)>a{ padding-right: 56px; padding-left: 56px; } .nav-sm .navbar2 .navbar-nav>li:nth-child(3)>ul{ width: 235px; } .nav-sm .navbar-default .navbar-nav>li>a { color: #333; text-decoration: none; } .nav-sm .navbar-default .navbar-nav>li>a:hover { background: url(/images/common/menu/sm-nav-bg_on_.jpg) repeat-x; } .nav-sm .navbar-default { background-color: transparent; border: 0; margin-bottom: 0; } .nav-sm .dropdown-menu>li>a:hover { background-color: #134613; color: #fff; } /* xsの時のnav */ @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ #top #header .nav-xs{ border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; } .nav-xs .dropdown-menu>li>a { padding-top: 7px; padding-bottom: 7px; font-size: 0.83em; } .nav-xs .dropdown-menu>li { border-bottom: solid 1px #a9a9a9; overflow: hidden; } .nav-xs .dropdown-menu li .nav-in-yaji{ float: right; margin-bottom: 5px; } .nav-xs .navbar-nav>li { padding: 0; border: solid 1px #CCC; border-top: solid 3px #000; font-weight: bold; } .nav-xs .navbar-nav>li a:hover { color: #fff; background-color: #317f00; } .nav-xs .navbar-nav>li>a{ padding: 10px 45px; background: url(/images/common/menu/sm-nav-bg.jpg) repeat-x; } .nav-xs .navbar1 .navbar-nav>li{ float: left; padding: auto; } .nav-xs .navbar1 .navbar-nav>li:nth-child(1){ width: 10%; } .nav-xs .navbar1 .navbar-nav>li:nth-child(2){ width: 45%; } .nav-xs .navbar1 .navbar-nav>li:nth-child(3){ width: 45%; } .nav-xs .navbar2 .navbar-nav>li:nth-child(1)>a{ } .nav-xs .navbar2 .navbar-nav>li:nth-child(2)>a{ } .nav-xs .navbar3 .navbar-nav>li:nth-child(1)>a{ } .nav-xs .navbar3 .navbar-nav>li:nth-child(1)>a{ } .navbar-nav { } .nav-xs .navbar-default .navbar-nav>li>a { color: #333; text-decoration: none; } .nav-xs .navbar-default .navbar-nav>li>a:hover { background: url(/images/common/menu/sm-nav-bg_on_.jpg) repeat-x; } .nav-xs .navbar-default { background-color: transparent; border: 0; margin-bottom: 0; } .nav-xs .dropdown-menu>li>a:hover { background-color: #134613; color: #fff; } } /* sidebar部分 **************************************/ @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ #sidebar{ margin-bottom: 25px; } } /* news部分 */ #side .news_box dl { margin: 0 auto 20px; } /* バナー部分 */ #side .side_bana{ text-align: center; max-width: 242px; /* 画像の大きさを大きく差し替えたら削除 */ margin-left: auto; margin-right: auto; } #side .side_bana_set{ text-align: center; } #side .m_xs,#side .m_s,#side .m_m,#side .m_l,#side .m_xl{ text-align: center; } #side .side_other div{ text-align: left; } #side .side_other ul li{ text-align: left; } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ /* SNSのアイコン系の中央揃え */ #side .side_other div{ text-align: center; } #side .side_other ul li{ text-align: center; } #side .side_other{ margin-bottom: 50px; } .ninja_onebutton{ width: 150px; margin-left: auto; margin-right: auto; } /* twitterの部分だけ左揃え */ #side .widget_twitter ul li{ text-align: left; } } /* セミナー＆メディア/協賛 */ #side .seminar h2{ border: solid 1px #d3d3d3; border-top: solid 2px #000; color: #666; font-weight: bold; font-size: 1.2em; padding: 0.7em 1em 0.7em 2.1em; background: url(http://iq-strategy.housaku.net/resource/uploads/2015/04/side-h2-bg.jpg) no-repeat left center; margin-bottom: 1em; margin-top: 40px; box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; -webkit-box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; -moz-box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; } #side .seminar .sem_item { margin: 0 auto 15px; border-bottom: dotted 1px #999; padding-bottom: 15px; text-align: left; clear: both; } #side .seminar header h3 { font-size : 14px; margin-bottom : 5px; } #side .seminar header{ margin-bottom : 12px; } /* NEWS */ #side .news_box { background: #eeeeee url(/images/common/base/s_news_bot.gif) left bottom no-repeat; padding-bottom: 15px; margin: 0 auto 1em; text-align: left; margin-bottom: 40px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; } #side .news_box dl { margin-left: 1.2em; margin-right: 1.2em; } #side .news_box h2{ margin-bottom: 13px; } #side .news_box .news_link{ text-align: right; padding-right: 20px; } /* facebook */ #side .facebook-box{ width: 95%; } /* ツイート */ .widget_twitter div { padding : 0; margin-bottom : 20px; } .widget_twitter ul li { border-bottom : 1px dotted #ccc; padding-top : 10px !Important; padding-bottom : 10px !Important; } .widget_twitter .entry-meta { display : block; } .widget_twitter .widgettitle { font-size : 12px; border-bottom : 1px dotted #ccc; padding-bottom : 7px; margin-bottom : 0px; } /* その他 */ #side .side_bana_set{ margin-bottom: 30px; } #side .side_bana{ margin-bottom: 5px; } #side .side_bana dfn{ display: block; margin-bottom: 0px; } #side .side_bana span{ display: block; width: 90%; margin: 0 auto; } #side .osmc { margin-left : 3px!important; } /* footer部分　元ソースより追加（base.css） **************************************/ #footer { clear : both; width : 100%; background : #f3f3f3 url(/images/common/base/footer_contents_bg.gif) 0 0 repeat-x; font-size:0.9em; } #footer .footer-up{ padding: 1em 2em; } #footer_inner .footer_top{ padding-top: 20px; } #footer_inner .footer_top hr{ border-top: solid 1px #dcdcdc; border-bottom: solid 1px #fff; } .footer_info .footer_link02 dt a{ /* メモのアイコンつけてる */ display : block; background : url(/images/common/icon/icon01.gif) 0 3px no-repeat; padding-left : 20px; padding-bottom : 8px; } .footer_info .footer_link02 dl { margin-bottom: 20px!important; } .footer_info .footer_link02 dd { width: 83%; margin: 0 auto 5px!important; margin-left: 1em; } #footer .copy { background-color: #292929; color : #a9a9a9; box-shadow:rgba(110, 110, 110, 0.270588) 0px 0px 2px 1px; -webkit-box-shadow:rgba(110, 110, 110, 0.270588) 0px 0px 2px 1px; -moz-box-shadow:rgba(110, 110, 110, 0.270588) 0px 0px 2px 1px; border-top: solid 1px #fff; } #footer .end_link a { color : #33a4c9; } #footer .footer-box{ margin-bottom: 30px; } #footer .footer_bt_set{ padding-top: 15px; } #footer .f_logo{ margin-bottom: 20px; } #footer p.text-right{ text-align: right; margin-right: 3em; } #footer p.end_text{ text-align: center; margin-bottom: 0.5em; } /* ページTOPへの位置を上に */ #footer .footer_page_top{ margin-top: -43px; } /* footerのnav */ #footer .sm-nav-index-xs{ margin-right: 5px; } #footer .footer-nav{ margin: 0 1em 20px 1em; } #footer .footer-nav ul>li>a{ padding: 10px 45px; background: url(/images/common/menu/sm-nav-bg.jpg) repeat-x; } #footer .footer-nav ul>li>a:hover{ background: url(/images/common/menu/sm-nav-bg_on_.jpg) repeat-x; } #footer .footer-nav ul>li{ border: solid 1px #ccc; border-top: solid 3px #000; } #footer .footer-nav ul>li>a { text-decoration: none; color: #292929; font-size: 1.1em; font-weight: bold; } /* footerのナビゲーション */ #footer p.brand{ font-size: 1.3em; margin-top: 13px; margin-left: 1em; } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ /* xsのときに中央ぞろえにする */ #footer .f_logo { text-align: center; } #footer .footer_inq{ text-align: center; } #footer .footer_bt_set{ text-align: center; } #footer .footer_link01 ul li{ text-align: center; } } /* slider_main のCSSのコピー style.cssより**********************************************/ div#contents { background-image:url(http://iq-strategy.rewrite-inc.com/resource/uploads/2014/10/english_1003-3-2_03.png); background-position:bottom; background-repeat:repeat-x; } div#mainimg { float:right; margin-top:5px; } div#simg { margin:0 auto; } /* index.phpのポジション合わせ */ #container .m_xl{ margin-top: 20px; margin-bottom: 30px; } /* indexのかざり*****************************************************************/ .at_title{ text-align: left; border: solid 1px #d3d3d3; border-top: solid 2px #2c6a13; color: #333; font-weight: bold; font-size: 1.8em; padding: 0.5em 0.8em; margin-bottom: 1em; margin-top: 20px; box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; -webkit-box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; -moz-box-shadow:rgba(220, 220, 220, 0.34902) 0px 0px 6px 2px; } .at_title02{ text-align: left; border: solid 1px #d3d3d3; border-top: solid 2px #006400; color: #333; font-weight: bold; font-size: 1.8em; padding: 0.4em 0.8em; margin-top: 2em; margin-bottom: 1em; } /* 全体的にindexの見出しの下の幅を中に調整 */ #main .index-inner{ padding-left: 10px; padding-right: 10px; } #sidebar .sem_item{ padding-left: 10px; padding-right: 10px; } /* パンくずリスト(list.cssより持ってきて一部修正) *****************************************************************/ /*--p_list--*/ .p_list_waku{ background : #ccc; width: 600px; } .p_list li, .p_list { margin : 0px; padding : 0px; list-style : none; } .p_list { background : #ccc; height : 100%; width: 600px; } .p_list li { float : left; display : block; background : #dddddd url(/images/common/icon/p_list_bg01.gif) right 50% no-repeat; padding-right : 15px; padding-left : 5px; padding-top : 4px; padding-bottom: 4px; font-size : 0.8em; } .p_list li.list_end { background : #dddddd url(/images/common/icon/p_list_bg02.gif) right 50% no-repeat; } /* nodesignのリセットＣＳＳ */ .nodesign img { vertical-align: baseline; } @media screen and (max-width: 720px){ .page-id-491 img { width:100%; } } /* index　TOPページ全体の修正 *******************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* index　あなたの英語力をアップさせる５つの上達理論とは *******************************/ /* indexのスライダーの再生再現に必要 */ #iqslider > div { width: 100%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .gakushu-slider{ margin-bottom: 0; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .gakushu-slider{ margin-bottom: 30px; } } .top_catch_inner02{ margin-bottom: 30px; } .box_xxl .riron5{ margin-top: -3px; padding-left: 13px; } .box_xxl .kyouzai{ padding-left: 15px; } .img-prev{ text-align: right; margin-top: 10px; } /* index　英会話教材　30日間英語脳育成プログラム lauout.cssより*******************************/ .prg_ban_set{ margin-bottom:15px; /* margin-top: 15px;*/ } .prg_box{ padding-bottom: 20px; } /* index　受講者の声 lauout.cssより*******************************/ .clearfix .top_voice_box01,.clearfix .top_voice_box02{ padding-left: 10px; padding-right: 10px; } .voice_set h3 { padding : 0px; margin : 0px; font-size : 13px; margin-bottom : 10px; font-weight : normal; } .clearfix .top_voice_box01 img,.clearfix .top_voice_box02 img{ float: right; } .voice_set .voice_name { margin-bottom : 10px; } .voice_set .voice_more { margin-top : 10px; text-align: right; margin-right: 75px; } .voice_set img{ margin-left: 1em; border: 1px #CCC solid; } .voice_top hr,.voice_bottom hr{ border-top: 1px #999 dotted; } /* index　英会話教材を開発した教授陣・講師陣 lauout.cssより*******************************/ #main .lec_s_box,#main .lec_ss_box{ margin: 0; padding: 0.2em; } #main .p-image{ margin-bottom: 30px; } #main .top_text{ margin-bottom: 40px; } /* index　英話を話す100のヒント｜最新情報 lauout.cssより*******************************/ .gr_box { background : #eeeeee url(/images/top/gr_box_top.gif) 0 0 no-repeat; width : 95%; margin : 0 auto; } .gr_box_bot { background : url(/images/top/gr_box_bot.gif) left bottom no-repeat; padding : 15px 15px 5px; margin-bottom : 30px; text-align : left; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; } .gr_box_inner { overflow:auto; height:25em; margin-bottom:10px; padding:5px } .desn_list li { list-style: none; margin: 0px 0 15px 0; padding: 0px 0 10px 0; margin-bottom: 3px; font-size: 14px; border-bottom: 1px dotted #333; } .alignleft { float: left; margin-right: 30px; margin-bottom: 30px; } /* IQSlider の設定 */ .iqslider-container #iqslider img.slide_content { width: 100%; } .iqslider-container #iqslider_prev_cursor { position: absolute; z-index: 20; top: 0; } .iqslider-container #iqslider_next_cursor { position: absolute; z-index: 20; right: 10px; top: 0; } /* 以下、固定ページの修正 *******************************/ /* /contents/contact/announcement.htm お知らせ *********************************************************/ @media screen and (min-width: 985px) { /* md,lg 表示領域が985px以上の場合に適用するスタイル */ .box_ann { background: url(/images/for_macusers/mac_bg.gif) 0 0 repeat-y; margin: 0 auto 30px; width: 655px; background-size: contain; } .box_ann_bot { background: url(/images/for_macusers/mac_bot.gif) left bottom no-repeat; padding-bottom: 10px; padding-top: 10px; width: 655px; background-size: contain; } .page-id-402 .box_ann .box_l{ width: 94%; padding-left: 0; } } @media screen and (max-width: 984px) { /* sm 表示領域が984px以下の場合に適用するスタイル */ .box_ann { width: 485px; background-size: contain; } .box_ann_bot { width: 485px; background-size: contain; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .box_ann { width: 100%; background-size: contain; } .box_ann_bot { width: 100%; background-size: contain; } } .box_ann > img:first-child { vertical-align: top; width: 655px; } .box_ann .ann_name { margin-top: 1em; } /* /contents/contact/ 英会話教材のお申し込みご利用ガイド *********************************************************/ .imp_title01,.imp_title02,.imp_title03,.imp_title04,.imp_title05,.imp_title06,.imp_title07 { height: 43px; font-weight: bold; } .index_title { text-align: left; padding: 0px; margin: 0px 0px 20px 0px; clear: both; } img { border: 0; vertical-align: top; } .text_left { text-align: left!important; background-color: rgba(255,255,255,0); } .inbox_guide { /* width: 690px; */ margin: 0 auto 30px; text-align: left; clear: both; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .inbox_guide { width: 690px; } .imp_link_box02 { width: 338px; } .imp_link_box03 { width: 336px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .inbox_guide { width: 100%; } .imp_link_box02 { width: 252px; } .imp_link_box03 { width: 252px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .inbox_guide { width: 100%; } .imp_link_box02 { width: 100%; } .imp_link_box03 { width: 100%; } /* 他のページにも使用 */ .imp_link_box03 { margin-left: 0 !important; } } .LinkBigBox { cursor: pointer; } .imp_link_box02 { float: left; display: block; margin: 0 auto 40px; padding-bottom: 10px; text-decoration: none; } .imp_link_box03 { float: left; display: block; margin-left: 10px; padding-bottom: 10px; margin-bottom: 30px; text-decoration: none; } /* /contents/faq/Win8.1 英会話教材　Windows 8.1でのアレンジ操作方法 *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .box_topics { //width: 93%; margin: 0 auto; text-align: left; } .box_pdf_dl { //width: 90%; height: 185px; background: url(/images/report/bg_pdf.gif) no-repeat; margin-top: 20px; margin-bottom: 20px; margin-left: 15px; position: relative; } .btn_dl02 { position: absolute; top: 48px; left: 179px; } .dl_img { margin: 20px auto; padding: 0; text-align: center; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_topics { //width: 93%; margin: 0 auto; text-align: left; } .box_pdf_dl { background-size: contain; height: 130px; background-size: contain; margin-top: 20px; margin-bottom: 20px; margin-left: 15px; } .btn_dl02 { padding-top: 25px; padding-left: 135px; } .btn_dl02 img { width: 75%; } .dl_img { padding: 0; text-align: center; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .box_pdf_dl { background-image: none; border: solid 4px #fff; margin-top: 20px; margin-bottom: 20px; background-color: #f8f6f0; box-shadow:rgba(219, 219, 219, 0.65098) 0px 0px 6px 3px; -webkit-box-shadow:rgba(219, 219, 219, 0.65098) 0px 0px 6px 3px; -moz-box-shadow:rgba(219, 219, 219, 0.65098) 0px 0px 6px 3px; padding-top: 2em; } .dl_img { padding: 0; text-align: center; } .btn_dl02 { padding-top: 0; padding-left: 0; } } /* /contents/faq/ よくある質問 *********************************************************/ .faq_q { width: 90%; padding: 0 0 15px 55px; background: url(/images/guide/icon_q.gif) no-repeat; text-align: left; margin: 0 auto 10px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .faq_a { margin: 0 35px 30px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .faq_a { margin: 0 25px 30px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .faq_q { width: 90%; padding: 0; background: none; text-align: left; margin: 0 auto 10px; } .faq_q table th{ width: 50px; } .faq_a { width: 90%; background: none; text-align: left; margin: 0 auto 10px; border-bottom: 1px solid #ddd; padding-bottom: 10px; display: none; } .faq_a table th{ width: 50px; vertical-align: top; border-right: dotted 1px #ccc; } .faq_a table th img{ padding-left: 2px; } .faq_a table td{ padding-left: 15px; } .faq_a_inner { background: none; padding: 0; margin-left: 0; } } /* /contents/guide/ お申し込み・お支払い方法 *********************************************************/ .box_payment_guide table{ margin-bottom: 1.5em; display: table; border-collapse: separate; border-spacing: 1px; border-color: gray; } .box_payment_guide .m_s{ margin-top: 1em; } .box_payment_guide table th{ padding: 1em 0.6em; font-weight: bold; } .box_payment_guide table td{ padding: 1em 0.6em; } .box_payment_guide h3 { display: block; font-size: 1.17em; margin-top: 1em; margin-bottom: 1em; -webkit-margin-before: 1em; -webkit-margin-after: 1em; -webkit-margin-start: 0px; -webkit-margin-end: 0px; font-weight: bold; } .box_gpay01,.box_gpay02,.box_gpay03,.box_gpay04,.box_gpay05{ min-height: 8.5em; } .box_payment_guide .box_gpay02 .min50{ min-width: 50px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-415 .text-br{ display: none; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .promise_01 { background: url(/images/guide/point_01_res.gif) no-repeat; } .promise_02 { background: url(/images/guide/point_02_res.gif) no-repeat; } .promise_03 { background: url(/images/guide/point_03_res.gif) no-repeat; } .promise_01, .promise_02, .promise_03 { padding-top: 9px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .int_pay { padding: 0; height: 55px; } } /* /contents/contact/for_overseas.htm 英会話教材の海外発送についてのご案内 *********************************************************/ .flow_arr{ text-align: center; } .inbox { //width: 684px; width: 95%; margin: 0px auto 30px; } .box_caut { //background: url("/images/for_overseas/caut_bg.gif") repeat-y scroll 0px 0px transparent; //width: 654px; margin: 0px auto 30px; } .box_flow01 { background: url("/images/for_overseas/flow01.gif") no-repeat scroll 0px 0px transparent; min-height: 88px; } .box_flow02 { background: url("/images/for_overseas/flow02.gif") no-repeat scroll 0px 0px transparent; min-height: 100px; } .box_flow03 { background: url("/images/for_overseas/flow03.gif") no-repeat scroll 0px 0px transparent; min-height: 100px; } .box_flow04 { background: url("/images/for_overseas/flow04.gif") no-repeat scroll 0px 0px transparent; min-height: 100px; } .box_flow05 { background: url("/images/for_overseas/flow05.gif") no-repeat scroll 0px 0px transparent; min-height: 80px; } .box_flow06 { background: url("/images/for_overseas/flow06.gif") no-repeat scroll 0px 0px transparent; min-height: 80px; } .box_flow_set h3 { padding-top: 3px; margin-bottom: 15px; font-size: 1.2em; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .box_caut {background: url("/images/for_overseas/caut_bg.gif") repeat-y scroll 0px 0px transparent;width: 654px;} .box_caut_bot { background-size: contain; width: 100%; } .box_flow01,.box_flow02,.box_flow03,.box_flow04,.box_flow05,.box_flow06{ width: 654px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_flow01, .box_flow02, .box_flow03, .box_flow04, .box_flow05, .box_flow06 {width: 92%;} .box_caut { background-size: contain; width: 100%; } .box_caut_bot { background-size: contain; width: 100%; } .box_flow01 { background: url("/images/for_overseas/flow01_res.gif") no-repeat scroll 0px 0px transparent; min-height: 88px; } .box_flow02 { background: url("/images/for_overseas/flow02_res.gif") no-repeat scroll 0px 0px transparent; } .box_flow03 { background: url("/images/for_overseas/flow03_res.gif") no-repeat scroll 0px 0px transparent; } .box_flow04 { background: url("/images/for_overseas/flow04_res.gif") no-repeat scroll 0px 0px transparent; } .box_flow05 { background: url("/images/for_overseas/flow05_res.gif") no-repeat scroll 0px 0px transparent; } .box_flow06 { background: url("/images/for_overseas/flow06_res.gif") no-repeat scroll 0px 0px transparent; } .box_flow01,.box_flow02,.box_flow03,.box_flow04,.box_flow05,.box_flow06{ width: 517px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_flow01, .box_flow02, .box_flow03, .box_flow04, .box_flow05, .box_flow06 { width: 100%; } } /* /contents/contact/for_macusers.htm この英会話教材をMacユーザーの皆様がお使いになる場合 *********************************************************/ .box_mac img{ vertical-align: top; } .box_mac { margin: 0px auto 30px; } .box_mac_bot { padding-bottom: 25px; } .box_mac_bot table { width: 90%; margin: 0px auto; } .box_mac_bot th { min-width: 148px; } .box_mac_bot h3 { font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .box_mac {width: 654px;background: url("/images/for_macusers/mac_bg.gif") repeat-y scroll 0px 0px transparent;} .box_mac02 { width: 651px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_mac { background-size: contain; width: 100%; } .box_mac_bot{ background-size: contain; width: 100%; } .box_mac02 { width: 490px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .box_mac02 { width: 95%; } } /* /contents/contact/receipt.htm 領収証の発行 *********************************************************/ .box_rec img{ vertical-align: top; } .box_rec { margin: 0px auto 30px; } .box_rec_bot h3{ font-weight: bold; line-height: 22.5px; font-size: 14px; } .box_rec_bot .inner02 table th{ font-weight: bold; } .box_rec_bot .inner02 table td{ padding: 0.2em; } .ent_box{ text-align: center; } .ent_box h4{ font-weight: bold; } .ent_box table th{ font-weight: bold; text-align: center; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .box_rec {width: 654px;background: url("/images/company/com_bg.gif") 0px 0px transparent;} .ent_box table td{ width: 80%; } .box_rec_bot .inner02{ width: 55%; text-align: center; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_rec { background-size: contain; width: 100%; } .box_rec_bot { background-size: contain; width: 100%; } .ent_box table td{ width: 60%; } .ent_box table td input.input-1{ width: 80%; } .ent_box table td textarea.input-1{ width: 80%; } .box_rec_bot .inner02{ width: 70%; text-align: center; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-423 .box_rec br { display: none; } .box_rec_bot .inner02{ width: 95%; text-align: center; } .box_rec_bot h3 { text-align: left; } } /* /contents/contact/form.htm お問い合わせ *********************************************************/ .page-id-426 .ent_box{ text-align: left; width: 95%; margin-left: auto; margin-right: auto; } .page-id-426 input[type="radio"], .page-id-426 input[type="checkbox"] { margin: 3px 0px 0px 8px; } .page-id-426 label{ font-weight: normal; } .page-id-426 .input_box table th{ text-align: left; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-426 .input_box{ padding-left: 25px; padding-top: 0; } .page-id-426 textarea,.page-id-426 input{ max-width: 450px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-426 .input_box{ padding-left: 25px; padding-top: 0; } .page-id-426 .input_box table th{ width: 30%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-426 .input_box table th{ width: 23%; } .page-id-426 .input_box{ padding-left: 10px; padding-top: 0; } } /* /contents/sitemap/ サイトマップ *********************************************************/ /* iPhoneで見出しの頭が高さが足りずに欠けるのを防ぐ為 */ #menu-sitemap li a { padding-bottom: 5px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/mailmag/index-members.htm 英会話上達メルマガの解除 *********************************************************/ .box_mail { margin: 1em auto 30px; } .box_mail img{ vertical-align: top; } .mail_ent_box .ent_box { text-align: left; } .ent_box .input_box p{ font-weight: normal; } .mail_ent_box .input_box .imp_text{ margin-bottom: 1em; } .page-id-671 .ent_box table th { font-weight: normal; padding-right: 0; } .page-id-671 .ent_box .input_box label,#main .page-id-671 .ent_box .input_box table th{ font-weight: normal; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .mail_ent_box {width: 600px;} .box_mail {width: 654px;background: url("/images/for_macusers/mac_bg.gif") repeat-y scroll 0px 0px transparent;} .area_set { width: 96%; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .mail_ent_box {width: 90%;} .box_mail{ background-size: contain; width: 100%; } .box_mail_bot{ background-size: contain; width: 100%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-671 .ch_set{ margin-left: 0; } .page-id-671 .area_set{ width: 100%; } } /* /contents/improvement/ 上達理論と教材開発者TOP *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-218 .imp_link_box03{ margin-left: 40px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ /* h2の背景が消えないようにするため */ .imp_title01 { background: url(/images/improvement/title01_bg_res.png) 0 0 no-repeat; } .imp_text01 { background: url(/images/improvement/line01_res.gif) 0 0 no-repeat; } .imp_title02 { background: url(/images/improvement/title02_bg_res.png) 0 0 no-repeat; } .imp_text02 { background: url(/images/improvement/line02_res.gif) 0 0 no-repeat; } .imp_title03 { background: url(/images/improvement/title03_bg_res.png) 0 0 no-repeat; } .imp_text03 { background: url(/images/improvement/line03_res.gif) 0 0 no-repeat; } .imp_title04 { background: url(/images/improvement/title04_bg_res.png) 0 0 no-repeat; } .imp_text04 { background: url(/images/improvement/line04_res.gif) 0 0 no-repeat; } .imp_title05 { background: url(/images/improvement/title05_bg_res.png) 0 0 no-repeat; } .imp_text05 { background: url(/images/improvement/line05_res.gif) 0 0 no-repeat; } .imp_title06 { background: url(/images/improvement/title06_bg_res.png) 0 0 no-repeat; } .imp_text06 { background: url(/images/improvement/line06_res.gif) 0 0 no-repeat; } .imp_title07 { background: url(/images/improvement/title06_bg_res.png) 0 0 no-repeat; } .imp_text07 { background: url(/images/improvement/line06_res.gif) 0 0 no-repeat; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/improvement/theory.htm 正しい上達理論に基づいた英会話教材 *********************************************************/ /* 固定ページ内の書き換えがメイン */ .theory_text { text-align: left; margin: 0px auto; width: 90%; background: url("/images/improvement/com_bg.gif") repeat-y scroll 0px 0px transparent; } .theory_box02_bot { background-size: contain; width: 100%; } .theory_box02 { background-size: contain; width: 100%; } .page-id-221 #main .text_middle { vertical-align: middle; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .step_ch { margin-left: 40px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .step_ch { margin-left: 10px; padding: 0 20px 0; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/improvement/interview.htm 英会話教材開発者　御園博士英語上達インタビュー *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .int_top { background: url("/images/interview/int_bg03.jpg") no-repeat scroll 0px 0px transparent; width: 664px; height: 342px; margin: 0px auto 30px; position: relative; text-align: left; } .int_top_r_inner { position: absolute; top: 44px; left: 34px; } .int_top_r_catch { margin-bottom: 21px; } .int_top_com { background: url("/images/interview/com_text_bg.png") repeat-y scroll 0px 0px transparent; width: 327px; padding: 15px; } .int_block { width: 657px; margin: 0px auto 30px; text-align: left; } .int_item, .int_item dd, .int_item dt { padding: 0px; margin: 0px; list-style: outside none none; } .int_item dt { padding-top: 5px; padding-right: 5px; width: 80px; font-weight: bold; text-align: left; float: left; font-size: 1.2em; } .int_item, .int_item dd, .int_item dt { padding: 0px; margin: 0px; list-style: outside none none; } .int_item dd { background: url("/images/interview/a_line.gif") repeat-y scroll 0px 0px transparent; width: 527px; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_pic_set .int_item dd{ width: 315px; } .clearfix::after { content: ""; display: block; clear: both; } .youtube_box { height: 232px; position: relative; margin: 0px auto 35px; width: 308px; padding-top: 30px; } .int_item, .int_item02 { clear: both; width: 95%; margin: 0px auto 20px; } .int_pic_set dt { width: 80px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .int_top { background: url("/images/interview/int_bg03.jpg") no-repeat scroll 0px 0px transparent; width: 517px; height: 266px; margin: 0px auto 30px; position: relative; text-align: left; background-size: contain; } .int_top_r_inner { position: absolute; top: 20px; left: 20px; } .int_top_r_catch { margin-bottom: 15px; } .int_top_r_catch > img{ width: 80%; } .int_top_com { background: url("/images/interview/com_text_bg.png") repeat-y scroll 0px 0px transparent; width: 300px; padding: 10px; } .int_pic_set .int_item dd{ width: 200px; } .int_block { width: 517px; margin: 0px auto 30px; text-align: left; } .int_item, .int_item dd, .int_item dt { padding: 0px; margin: 0px; list-style: outside none none; } .int_item dt { padding-top: 5px; padding-right: 5px; width: 80px; font-weight: bold; text-align: left; float: left; font-size: 1.2em; } .int_item, .int_item dd, .int_item dt { padding: 0px; margin: 0px; list-style: outside none none; } .int_item dd { background: url("/images/interview/a_line.gif") repeat-y scroll 0px 0px transparent; width: 410px; float: left; text-align: left; padding: 5px 0px 5px 30px; } .clearfix::after { content: ""; display: block; clear: both; } .youtube_box { height: 232px; position: relative; margin: 0px auto 35px; width: 308px; padding-top: 30px; } .int_item, .int_item02 { clear: both; width: 95%; margin: 0px auto 20px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .int_top { background: none; } .int_top_r_catch { margin-bottom: 15px; } .int_top_r_inner { position: static; } .int_top_r_catch > img{ width: 60%; } .int_top_com { background: url("/images/interview/com_text_bg.png") repeat-y scroll 0px 0px transparent; width: 60%; padding: 10px; } .int_pic_set .int_item dd{ width: 80%; } .int_block { width: 100%; margin: 0px auto 30px; text-align: left; } .int_item, .int_item dd, .int_item dt { padding: 0px; margin: 0px; list-style: outside none none; } .int_item dt { padding-top: 5px; padding-right: 5px; width: 15%; font-weight: bold; text-align: left; float: left; font-size: 1.2em; } .int_item, .int_item dd, .int_item dt { padding: 0px; margin: 0px; list-style: outside none none; } .int_item dd { background: url("/images/interview/a_line.gif") repeat-y scroll 0px 0px transparent; width: 80%; float: left; text-align: left; padding: 5px 0px 5px 30px; } .clearfix::after { content: ""; display: block; clear: both; } .youtube_box { height: 232px; position: relative; margin: 0px auto 35px; width: 308px; padding-top: 30px; } .int_item, .int_item02 { clear: both; width: 95%; margin: 0px auto 20px; } .int_block .layout_table td>img{ min-width: 115px; } .page-id-224 .layout_table img{ min-width: 120px; } .visible-xs .int_top_com02{ margin-top: 20px; margin-bottom: 20px; padding: 1em; background-color: #dcdcdc; } } .int_block h2 { background: url("/images/interview/title_bg_img.gif") no-repeat 0px 11px ; margin: 0px 0px 20px; background-color: #2f3e2e; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; width: 100%; height: auto; padding: 12px 0px 12px 45px; font-size: 1.5em; color: #FFF; clear: both; } /* /contents/development/ 英会話教材の開発を担当した教授陣のご紹介 *********************************************************/ .staff_box_bot { background-size: contain; width: 100%; } .staff_box .layout_table td{ width: 65%; } .staff_box .layout_table th.pic_s{ width: 20%; } .staff_box .sts_data table{ margin-bottom: 20px; } .staff_box_top .staff_box_bot .layout_table{ width: 100%; padding-top: 20px; } .book_title { width: 70px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .staff_box .sts_data .t2-1 { height: 200px; } .staff_box .sts_data .t2-3 { height: 223px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .staff_box_top .staff_box_bot .layout_table{ width: 95%; padding-top: 20px; margin-left: auto; margin-right: auto; } .staff_box .sts_data .t1-1,.staff_box .sts_data .t2-1 { height: 260px; } .staff_box .sts_data .t1-2,.staff_box .sts_data .t2-2 { height: 160px; } .staff_box .sts_data .t1-3,.staff_box .sts_data .t2-3 { height: 286px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .staff_box .sts_data { width: auto; } .staff_box .sts_data .t1-1,.staff_box .sts_data .t2-1 { height: auto; } .staff_box .sts_data .t1-2,.staff_box .sts_data .t2-2 { height: auto; } .staff_box .sts_data .t1-3,.staff_box .sts_data .t2-3 { height: auto; } .staff_box_xs{ padding: 15px 10px 20px; } .staff_box .pic_s img{ width: 127px; } } /* /contents/development/interview1x.htm 英会話教材開発者　御園和夫先生インタビュー *********************************************************/ .int_block h2.int_title { background: url("/images/interview/a_line02_img.gif") no-repeat left center; background-color: #1a7317; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; width: 100%; padding-top: 20px; padding-bottom: 20px; font-size: 1.5em; color: #FFF; clear: both; font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .int_top01 { background: url("/images/interview/int_bg01.jpg") no-repeat scroll 0px 0px transparent; width: 664px; height: 342px; margin: 0px auto 30px; position: relative; text-align: left; } .int_top_inner { position: absolute; top: 47px; left: 290px; } .int_top_catch { margin-bottom: 21px; } .int_top_com { background: url("/images/interview/com_text_bg.png") repeat-y scroll 0px 0px transparent; width: 357px; padding: 15px; } .int_item02 dt { padding-top: 5px; padding-right: 5px; width: 80px; font-weight: bold; text-align: left; float: left; font-size: 1.2em; } .int_item02 dd { background: url("/images/interview/a_line02.gif") repeat-y scroll 0px 0px transparent; width: 540px; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_pic_set .int_item02 dd { background: url("/images/interview/a_line02.gif") repeat-y scroll 0px 0px transparent; width: 320px; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_item, .int_item02 { clear: both; width: 95%; margin: 0px auto 20px; } .int_st_info .inner { background: none repeat scroll 0% 0% #FFF; border-width: 1px 1px 2px; border-style: solid; border-color: #CCC #CCC #063; -moz-border-top-colors: none; -moz-border-right-colors: none; -moz-border-bottom-colors: none; -moz-border-left-colors: none; border-image: none; padding: 15px; } .int_st_top { font-size: 1.2em; padding-bottom: 5px; margin-bottom: 10px; border-bottom: 1px dotted #CCC; color: #393; } .int_st_top span { font-size: 1.4em; color: #333; margin-left: 10px; font-weight: bold; } .int_st_info .st_line { border-bottom: 1px solid #CCC; margin-bottom: 5px; padding-bottom: 5px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .int_top01 { background: url("/images/interview/int_bg01.jpg") no-repeat scroll 0px 0px transparent; width: 517px; height: 266px; background-size: contain; margin: 0px auto 30px; position: relative; text-align: left; } .int_top_inner { width: 250px; height: 59px; position: absolute; top: 20px; left: 230px; } .int_top_catch { margin-bottom: 21px; } .int_top_com { background: url("/images/interview/com_text_bg.png") repeat-y scroll 0px 0px transparent; width: 270px; padding: 10px; font-size: 0.9em; } .int_item02 dt { padding-top: 5px; padding-right: 5px; width: 80px; font-weight: bold; text-align: left; float: left; font-size: 1.2em; } .int_item02 dd { background: url("/images/interview/a_line02.gif") repeat-y scroll 0px 0px transparent; width: 83%; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_pic_set .int_item02 dd { background: url("/images/interview/a_line02.gif") repeat-y scroll 0px 0px transparent; width: 200px; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_item, .int_item02 { clear: both; width: 95%; margin: 0px auto 20px; } .int_st_info .inner { background: none repeat scroll 0% 0% #FFF; border-width: 1px 1px 2px; border-style: solid; border-color: #CCC #CCC #063; -moz-border-top-colors: none; -moz-border-right-colors: none; -moz-border-bottom-colors: none; -moz-border-left-colors: none; border-image: none; padding: 15px; } .int_st_top { font-size: 1.2em; padding-bottom: 5px; margin-bottom: 10px; border-bottom: 1px dotted #CCC; color: #393; } .int_st_top span { font-size: 1.4em; color: #333; margin-left: 10px; font-weight: bold; } .int_st_info .st_line { border-bottom: 1px solid #CCC; margin-bottom: 5px; padding-bottom: 5px; } .int_pic_set img { width: 200px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .int_top01 { background: url("/images/interview/int_bg01.jpg") no-repeat scroll 0px 0px transparent; background-size: contain; width: 100%; height: auto; margin: 0px auto 30px; position: static; text-align: left; } .int_top_inner { width: auto; height: auto; position: static; } .int_top_catch { margin-bottom: 21px; } .int_top_com { background: url("/images/interview/com_text_bg.png") repeat-y scroll 0px 0px transparent; width: auto; padding: 15px; } .int_item02 dt { padding-top: 5px; padding-right: 5px; width: 20%; font-weight: bold; text-align: left; float: left; font-size: 1.2em; } .int_item02 dt img{ width:25%; } .int_item02 dd { background: url("/images/interview/a_line02.gif") repeat-y scroll 0px 0px transparent; width: 80%; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_pic_set .int_item02 dd { background: url("/images/interview/a_line02.gif") repeat-y scroll 0px 0px transparent; width: 200px; float: left; text-align: left; padding: 5px 0px 5px 30px; } .int_item, .int_item02 { clear: both; width: 95%; margin: 0px auto 20px; } .int_st_info .inner { background: none repeat scroll 0% 0% #FFF; border-width: 1px 1px 2px; border-style: solid; border-color: #CCC #CCC #063; -moz-border-top-colors: none; -moz-border-right-colors: none; -moz-border-bottom-colors: none; -moz-border-left-colors: none; border-image: none; padding: 15px; } .int_st_top { font-size: 1.2em; padding-bottom: 5px; margin-bottom: 10px; border-bottom: 1px dotted #CCC; color: #393; } .int_st_top span { font-size: 1.4em; color: #333; margin-left: 10px; font-weight: bold; } .int_st_info .st_line { border-bottom: 1px solid #CCC; margin-bottom: 5px; padding-bottom: 5px; } } /* /contents/development/interview2x.htm 英会話教材開発者　串田美保子先生インタビュー *********************************************************/ .int_st_info p{ margin-bottom: 0; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .int_top02 { background: url("/images/interview/int_bg02.jpg") no-repeat scroll 0px 0px transparent; width: 664px; height: 342px; margin: 0px auto 30px; position: relative; text-align: left; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .int_top02 { background: url("/images/interview/int_bg02.jpg") no-repeat scroll 0px 0px transparent; width: 517px; height: 266px; background-size: contain; margin: 0px auto 30px; position: relative; text-align: left; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .int_top02 { background: url("/images/interview/int_bg02.jpg") no-repeat scroll 0px 0px transparent; background-size: contain; width: 100%; height: auto; margin: 0px auto 30px; position: static; text-align: left; } .int_top_inner { width: auto; height: auto; position: static; } .us_int_block h2.us_int_title span { padding: 20px 10px 20px 20px; } } /* /contents/company/ 会社情報TOP *********************************************************/ .page-id-388 .com_text01 .m_l,.page-id-388 .com_text02 .m_l,.page-id-388 .com_text03 .m_l,.page-id-388 .com_text04 .m_l,.page-id-388 .com_text05 .m_l,.page-id-388 .com_text06 .m_l{ font-weight: normal; } .com_text01,.com_text02 { background: none; padding: 0; margin: 0 auto 0; } .com_text01 .com_name, .com_text02 .com_name { margin-bottom: 0; margin-top: 10px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-388 .com_text05 img,.page-id-388 .com_text06 img{ width: 127px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-388 .com_text05 img,.page-id-388 .com_text06 img{ width: auto; } } /* /contents/company/message.htm 英会話上達研究会 代表　青木正一　メッセージ *********************************************************/ .pmes_title { margin: 40px 0px; } .pmes_box { background: url("/images/company/mes_box_bg.gif") repeat-y scroll 0px 0px transparent; width: 236px; margin-left: 20px; float: right; } .pmes_box_top { background: url("/images/company/mes_box_top.gif") no-repeat scroll 0px 0px transparent; padding-top: 25px; } .pmes_box_bot { background: url("/images/company/mes_box_bot.gif") no-repeat scroll left bottom transparent; padding: 0px 22px 25px; } .pmes_name { color: #060; font-weight: bold; margin-bottom: 10px; padding-bottom: 5px; border-bottom: 1px dotted #CCC; } .pmes_prf { background: none repeat scroll 0% 0% #EDEDED; padding: 5px; } .pmes_box02 { line-height: 1.8; } .pmes_sign { text-align: right; font-weight: bold; margin-bottom: 20px; } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .pmes_box { margin: 0; background: none; width: auto; border:1px solid rgb(204, 204, 204); box-shadow:rgba(217, 217, 217, 0.45098) 0px 0px 3px 3px; -webkit-box-shadow:rgba(217, 217, 217, 0.45098) 0px 0px 3px 3px; -moz-box-shadow:rgba(217, 217, 217, 0.45098) 0px 0px 3px 3px; } .pmes_box_top { background: none; } .pmes_box_bot .m_s{ text-align: center; } .pmes_box_bot .m_s img{ max-width: 193px; } .pmes_box_bot { background: none; } } /* /contents/company/detail.htm 会社概要　メディア掲載情報　英会話教材の評価・評判 *********************************************************/ .prom_box { background-size: contain; width: 100%; } .prom_box .prom_box_inner { width: 80%; } .logo_box { padding-left: 190px; padding-top: 30px; text-align: left; min-height: 163px; } .media_table .media_img { width: 130px; text-align: center; } .media_table .media_cont { text-align: left; padding-left: 10px; border-bottom: 1px solid #CCC; } .layout_table { width: 100%; border-collapse: collapse; padding: 0px; margin: 0px; } .data_box table { border-top: 1px solid #CCC; border-left: 1px solid #CCC; text-align: left; margin-left: auto; margin-right: auto; margin-bottom: 15px; } .rep_name { width: 100px; //float: left; } .media_table .media_cont { text-align: left; padding-left: 10px; border-bottom: 1px solid #CCC; } .rep_link, .rep_link li { margin: 0px; padding: 0px; list-style: outside none none; } .rep_link li a { display: block; background: url("/images/common/icon/icon02.png") no-repeat scroll 0px 0px transparent; padding-left: 20px; } .fl_list_set h3 { clear: both; font-weight: bold; font-size: 1.2em; border-bottom: 1px dotted #CCC; padding-top: 3px; padding-bottom: 10px; margin-bottom: 10px; padding-left: 30px; color: #060; background: url("/images/common/icon/sub_title_icon.png") no-repeat scroll 0px 0px transparent; } .media_table .media_img span { max-width: 83px; min-width: 50px; } .page-id-394 .media_table { text-align: center; } .page-id-394 .media_table .media_cont{ text-align: left; } .fl_list_set .fl { float: left; width: 400px; } .fl_list_set ul, .fl_list_set li { padding: 0px; margin: 0px; list-style: outside none none; } .fl_list_set li { background: url("/images/common/icon/re_icon.gif") no-repeat scroll 0px 50% transparent; padding-left: 15px; } .fl_list_set .fr { float: left; margin-left: 0; margin-bottom: 20px; } .inbox td{ padding: 5px; } .inbox td:nth-child(1){ border: solid 3px #fff; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .s-b-img{ margin-top: 0.8em; } .page-id-394 .media_table .media_cont{ width:430px; } .inbox td:nth-child(1){ border: none; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .s-b-img{ margin-top: 0; margin-bottom: 1em; } .com_data th { width: 8em; } .page-id-394 .media_table .media_cont{ width:245px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .com_data th { width: 7em; } .fl_list_set .fl,.fl_list_set .fr { float: none; width: 100%; } .logo_box { padding-left: 120px; padding-top: 0px; background-size: 110px 110px; } .page-id-394 .media_table .media_cont{ width: 70%; } .page-id-394 .media_table { text-align: left; border: solod 1px #ccc; } } /* /contents/momosuke/momosuke-eigo009.htm マスコミ取材履歴-1,-2 *********************************************************/ .med_det_box .med_det_box_inner{ padding: 50px 30px 10px; } .pri_sub_title { font-weight: bold; font-size: 1.2em; padding-top: 3px; margin-top: 1em; } .inbox img{ vertical-align: top; } .box_pri_bot h3{ font-weight: bold; font-size: 14px; } h3.title02{ font-weight: bold; font-size: 14px; } .box_pri_bot th.tru-mark{ width: 20%; } .box_pri_bot th.tru-mark img{ min-width: 60px; } .page-id-396 .gr_box_bot ol,.page-id-396 .gr_box_bot ol li{ list-style-type: decimal; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .box_pri{ margin-left: 10px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .med_det_box_inner { background-size: contain; width: 100%; } .med_det_box { background-size: contain; width: 100%; } .box_pri{ margin-left: auto; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_pri { background-size: contain; width: 100%; } .box_pri_bot { background-size: contain; width: 100%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/company/privacy.htm プライバシーポリシー *********************************************************/ .page-id-396 ol.truse_list,.page-id-396 ol.truse_list li{ list-style-type: decimal; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/company/law.htm 特定商取引法に基づく表記 *********************************************************/ .tb_title{ width:108px; } .page-id-398 .data_box .layout_table{ width: 100%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-398 .data_box .layout_table th{ width: 171px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-398 .data_box .layout_table th{ width: 10em; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .low_data td { border-bottom: solid 1px #CCC; } .low_data th { border-bottom: dashed 1px #CCC; padding-top: 5px; padding-bottom: 5px; } } /* /contents/commonalty/ 返品規程 *********************************************************/ .box_com { background-size: contain; width: 100%; } .box_com_bot { background-size: contain; width: 100%; } .page-id-2644 .box_com ol,.page-id-2644 .box_com ol li{ list-style-type: decimal; } /* /contents/development/ 法人のお客様へ *********************************************************/ .com_form_table th{ border: solid 3px #fff; font-weight: bold; } .com_form_table td label{ font-weight: normal; margin-right: 0.5em; } .com_form_table td{ text-align: center; } .page-id-243 .required{ text-align: center; } .page-id-356 .com_form_table td{ text-align: left; border-bottom: solid 3px #fff; } .page-id-356 .com_form_table td.cell_01{ text-align: center; } .page-id-356 input,.page-id-356 textarea{ max-width: 400px; } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-356 input,.page-id-356 textarea{ max-width: 200px; } } /* /contents/commonalty/list.htm 導入企業・教育機関の例 *********************************************************/ .com_list_table{ margin-left: auto; margin-right: auto; } .com_list_table p{ padding-left: 9em; margin-top: 1em; } ul.com_list { margin-bottom: 0; } /* /contents/report/check_ans.htm 聴き取りチェック解答編 *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .ea_box { background-size: 250px; width: 100%; height: 160px; margin-bottom: 50px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .ea_box { background-size: 160px; width: 100%; height: 160px; margin-bottom: 50px; padding-left: 200px; padding-top: 0; } .ans_box_top01 { background-size: contain; width: 100%; } .ans_box_bot { background-size: contain; width: 100%; } .ans_box { background-size: contain; width: 100%; } .ans_box_top02 { background-size: contain; width: 100%; } .box_voice_inner { background-size: contain; width: 100%; } .box_voice { background-size: contain; width: 100%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .ea_box { background-size: 140px; width: 100%; height: auto; margin-bottom: 50px; padding-left: 180px; padding-top: 0; } .report_top { margin: 20px auto; background: none; padding: 0; } .ans_box_bot { padding: 40px 30px 30px 70px; } } /* /contents/mailmag/index.htm 英会話上達メルマガ *********************************************************/ .mail_entry h2{ margin-bottom: 1.5em; } .mail_sample{ margin-bottom: 30px; } /* /contents/A8-photo A8ネットアフィリエイト(一般サイト用サンプルページ) *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .img-page2524{ text-align: left; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .img-page2524{ text-align: center; margin-bottom: 1em; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-2524 #main img{ width: 50%; } .img-page2524{ text-align: center; } } /* /contents/apply/ 教材のお申し込みTOP *********************************************************/ #apply-new { margin-bottom: 60px; } #apply-new .set_list_top02 { height: 30px; } #apply-new .lv_box01_bot { background-size: contain; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .w300{ width: 320px; padding-right: 15px; } #apply-new .w518{ width: 518px; padding-right: 15px; } table td.w190{ width: 290px; } .page-id-2594 .layout_table{ width: 100%; } #apply-new .ch_item_box .ch_item02 { width: 880px; } .set_list_item li{ width: 130px; } #apply-new .set_layout .set_ps { right: 272px; top: 75px; } #apply-new .set_layout { margin: 0; } #apply-new .set_list_item02 { width: 270px; } #apply-new .ch_s_item { margin-top: 10px; margin-left: 0; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ #main_one_column #apply-new .set_inner{ width: 615px; } #apply-new .lv_box01 { background-size: contain; width: 100%; } #apply-new .set_inner { background-size: contain; width: 95%; } #apply-new .lv_box01_top { background-size: contain; width: 100%; } #apply-new .ch_item_box { background-size: contain; width: 97%; } #apply-new .ch_item_box_bot { background-size: contain; width: 100%; } #apply-new .ch_item_box .ch_item { width: 95%; } #apply-new .ch_item_box .ch_item02 { width: 95%; } #apply-new .ch_s_item { width: auto; } .ch_list_item td{ padding-right: 15px; } .w300{ width: 336px; } #apply-new .s_item_box { width: 97%; } #apply-new .s_item td.s_item_img { width: 18%; } #apply-new .s_item .s_item_det { width: 50%; padding-right: 10px; } #apply-new .s_item .s_item_det_box { width: auto; } #apply-new .s_item_box .s_item { width: 100%; } #apply-new .s_item_box .s_item .layout_table{ width: 98%; } #apply-new .ch_item_box_bot .ch_item02 .layout_table{ width: 100%; } #apply-new .ch_item_box .ch_item02 { padding-left: 10px; padding-right: 10px; } #apply-new .set_list_item03 li { width: 150px; } #apply-new .set_list_item li{ width: 85px; } #apply-new .set_list_item { width: 380px; } #apply-new .set_layout .set_ps { right: 234px; top: 80px; } #apply-new .set_list_item02 li{ width: 55px; } .set_inner .return_link { position: absolute; top: 0; left: 320px; } .all-table01,.all-table01 th,.all-table01 td{ border-collapse: collapse; } .all-table01,.all-table02{ width: 95%; margin-bottom: 30px; margin-left: 10px; } .pro_info_text{ background: #eeeeee; margin-bottom: 20px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; padding: 20px; } .all-table01 .mida-in{ vertical-align: top; background-image: url(/images/application-new/mida-in-bg.gif); background-repeat: repeat-y; width: 28px; min-width: 28px; padding: 0; } .mida-top{ width: 28px; min-width: 28px; height: 20px; padding: 0; } .mida-bot{ width: 28px; min-width: 28px; height: 20px; padding: 0; } .right-td{ width: auto; } .right-box{ width:100%; padding: 1em; margin-left: 10px; border: solid 1px #dcdcdc; box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 5px 1px; -webkit-box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 5px 1px; -moz-box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 5px 1px; margin-bottom: 10px; } .set-top{ border: solid 1px #dcdcdc; border-radius: 3px; padding: 1em; margin: 0 10px 0; margin-bottom: 10px; } .set-bot{ border: solid 1px #dcdcdc; border-radius: 3px; padding: 1em; margin: 0 10px 0; } .set-all{ margin-top: 20px; margin-bottom: 30px; border: solid 1px #dcdcdc; border-radius: 3px; box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 3px 1px; -webkit-box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 3px 1px; -moz-box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 3px 1px; padding-bottom: 5px; } .set01_title,#apply-new .set02_title{ margin-left: 10px; } .all-table02 .mida-in{ vertical-align: top; background-image: url(/images/application-new/mida02-in-bg.gif); background-repeat: repeat-y; width: 28px; min-width: 28px; padding: 0; } .ch_item02 { width: auto; margin: 0 auto; background: #eee; padding: 15px; width:90%; } .right-box form input[type=image]{ width: 98%; } #apply-new .s_item_app form input[type=image]{ width: auto; } #apply-new .ch_item form input[type=image]{ width: 95%; } /* smのここだけにつけたサイドの中ページのリストの装飾 */ /* サイドの中ページのリストの装飾 */ #apply-new { margin-bottom: 40px; } #main_one_column2594{ padding-left: 5px; padding-right: 5px; margin-bottom: 60px; } #main_one_column2594 .cont_nav_box { margin-bottom: 30px; text-align: left; } #main_one_column2594 .cont_nav_box{ position:relative; -webkit-box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; -moz-box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; } #main_one_column2594 .nav01:before, #main_one_column2594 .nav01:after{ content:""; position:absolute; z-index:-1; -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8); -moz-box-shadow:0 0 20px rgba(0,0,0,0.8); box-shadow:0 0 20px rgba(0,0,0,0.8); top:50%; bottom:0; left:8px; right:8px; } #main_one_column2594 .nav01:after{ right:10px; left:auto; -webkit-transform:skew(8deg) rotate(3deg); -moz-transform:skew(8deg) rotate(3deg); -ms-transform:skew(8deg) rotate(3deg); -o-transform:skew(8deg) rotate(3deg); transform:skew(8deg) rotate(3deg); } #main_one_column2594 .nav01{ background-color: #fff; } #main_one_column2594 .nav01 dl{ margin-bottom: 0; } #main_one_column2594 .nav01 dl dt{ background: #f5f5f5; /* Old browsers */ background: -moz-linear-gradient(top, #f5f5f5 1%, #ffffff 35%, #ffffff 35%, #f5f5f5 35%, #f5f5f5 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#f5f5f5), color-stop(35%,#ffffff), color-stop(35%,#ffffff), color-stop(35%,#f5f5f5), color-stop(100%,#f5f5f5)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* IE10+ */ background: linear-gradient(to bottom, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#f5f5f5',GradientType=0 ); /* IE6-9 */ border: solid 1px #dcdcdc; border-collapse: collapse; overflow: hidden; } #main_one_column2594 .nav01 dl dd{ background-color: #eeeeee; border-bottom: dotted 1px #999; border-left: solid 1px #dcdcdc; border-right: solid 1px #dcdcdc; overflow: hidden; /*background: url(/images/common/menu/sm-nav-in-index.png) no-repeat;*/ } #main_one_column2594 .nav01 dl a{ display: block; zoom: 1; /* IE6以前に対応 */ } #main_one_column2594 .nav01 dl a>span{ text-decoration: underline !important; } #main_one_column2594 .nav01 dl a{ font-weight:normal; } #main_one_column2594 .nav01 dl a:hover{ text-decoration: none; } #main_one_column2594 .nav01 dl dt img{ float: right; padding-left: 0.6em; border-left: dotted 1px #999; } #main_one_column2594 .nav01 dl dd img{ margin-right: 0.5em; } #main_one_column2594 .nav01 dl dt a:hover{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #main_one_column2594 .nav01 dl>dt>a>div{ padding: 1em 1em 1em 1.3em; } /* smの時だけサイドバーの文字幅固定する */ #main_one_column2594 .nav01 dl>dt>a>div>span{ width: 80%; } #main_one_column2594 .nav01 dl>dt>a>div>span{ padding-right: 0.5em; margin-right: 0; display: block; float: left; text-decoration: underline; } #main_one_column2594 .nav01 dl dd a{ padding: 0.7em 1em 0.7em 2em; } #main_one_column2594 .nav01 dl dd a:hover{ color: #fff; background-color: #317f00; } #main_one_column2594 .nav01 dt.ac01 a{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #main_one_column2594 .nav01 dd.ac02 a{ color: #fff; background-color: #317f00; } #main_one_column2594 .nav01 dt.ac03 a{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #apply-new .set_inner h3 { margin-bottom: 15px; } #apply-new .set_inner .return_link{ margin-bottom: 20px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ #apply-new .set_list_box { margin-top: 15px; } .all-table01,.all-table02{ margin-left: 0; } #apply-new .s_item .s_item_det{ padding-right: 0; } #apply-new .s_item .s_item_det_box { padding-right: 0; } #apply-new .s_item_box .s_item { width: 95%; } #apply-new .s_item td.s_item_app { width: 50%; } #apply-new .m_xs form input[type=image]{ width: 100%; } #apply-new .set_inner strong.pro_catch { margin-top: 25px; margin-bottom: 5px; } #main_one_column #apply-new .set_inner{ width: auto; } .all-table01,.all-table01 th,.all-table01 td{ border-collapse: collapse; } .all-table01,.all-table02{ width: 95%; margin-bottom: 30px; } .pro_info_text{ background: #eeeeee; margin-bottom: 20px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; padding: 20px; } .all-table01 .mida-in{ vertical-align: top; background-image: url(/images/application-new/mida-in-bg.gif); background-repeat: repeat-y; width: 28px; min-width: 28px; padding: 0; } .right-box{ width:100%; padding: 1em; margin-left: 10px; border: solid 1px #dcdcdc; box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 5px 1px; -webkit-box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 5px 1px; -moz-box-shadow:rgba(204, 204, 204, 0.65098) 0px 0px 5px 1px; margin-bottom: 10px; } .set-top{ border: solid 1px #dcdcdc; border-radius: 3px; padding: 1em; margin: 0 10px 0; margin-bottom: 10px; } .set-bot{ border: solid 1px #dcdcdc; border-radius: 3px; padding: 1em; margin: 0 10px 0; } .set-all{ margin-bottom: 5px; } .set01_title,#apply-new .set02_title{ margin-left: 10px; } .all-table02 .mida-in{ vertical-align: top; background-image: url(/images/application-new/mida02-in-bg.gif); background-repeat: repeat-y; width: 28px; min-width: 28px; padding: 0; } .ch_item02 { width: auto; margin: 0 auto; background: #eee; padding: 15px; width:90%; } .right-box form input[type=image]{ width: 95%; } #apply-new .s_item_app form input[type=image]{ width: auto; } #apply-new .ch_item form input[type=image]{ width: 95%; } /* smのここだけにつけたサイドの中ページのリストの装飾 */ /* サイドの中ページのリストの装飾 */ #apply-new { margin-bottom: 40px; } #main_one_column2594{ padding-left: 5px; padding-right: 5px; margin-bottom: 60px; } #main_one_column2594 .cont_nav_box { margin-bottom: 30px; text-align: left; } #main_one_column2594 .cont_nav_box{ position:relative; -webkit-box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; -moz-box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; box-shadow:0 1px 10px rgba(0, 0, 0, 0.2), 0 0 40px rgba(0, 0, 0, 0.2) inset; } #main_one_column2594 .nav01:before, #main_one_column2594 .nav01:after{ content:""; position:absolute; z-index:-1; -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8); -moz-box-shadow:0 0 20px rgba(0,0,0,0.8); box-shadow:0 0 20px rgba(0,0,0,0.8); top:50%; bottom:0; left:8px; right:8px; } #main_one_column2594 .nav01:after{ right:10px; left:auto; -webkit-transform:skew(8deg) rotate(3deg); -moz-transform:skew(8deg) rotate(3deg); -ms-transform:skew(8deg) rotate(3deg); -o-transform:skew(8deg) rotate(3deg); transform:skew(8deg) rotate(3deg); } #main_one_column2594 .nav01{ background-color: #fff; } #main_one_column2594 .nav01 dl{ margin-bottom: 0; } #main_one_column2594 .nav01 dl dt{ background: #f5f5f5; /* Old browsers */ background: -moz-linear-gradient(top, #f5f5f5 1%, #ffffff 35%, #ffffff 35%, #f5f5f5 35%, #f5f5f5 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#f5f5f5), color-stop(35%,#ffffff), color-stop(35%,#ffffff), color-stop(35%,#f5f5f5), color-stop(100%,#f5f5f5)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* IE10+ */ background: linear-gradient(to bottom, #f5f5f5 1%,#ffffff 35%,#ffffff 35%,#f5f5f5 35%,#f5f5f5 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#f5f5f5',GradientType=0 ); /* IE6-9 */ border: solid 1px #dcdcdc; border-collapse: collapse; overflow: hidden; } #main_one_column2594 .nav01 dl dd{ background-color: #eeeeee; border-bottom: dotted 1px #999; border-left: solid 1px #dcdcdc; border-right: solid 1px #dcdcdc; overflow: hidden; /*background: url(/images/common/menu/sm-nav-in-index.png) no-repeat;*/ } #main_one_column2594 .nav01 dl a{ display: block; zoom: 1; /* IE6以前に対応 */ } #main_one_column2594 .nav01 dl a>span{ text-decoration: underline !important; } #main_one_column2594 .nav01 dl a{ font-weight:normal; } #main_one_column2594 .nav01 dl a:hover{ text-decoration: none; } #main_one_column2594 .nav01 dl dt img{ float: right; padding-left: 0.6em; border-left: dotted 1px #999; } #main_one_column2594 .nav01 dl dd img{ margin-right: 0.5em; } #main_one_column2594 .nav01 dl dt a:hover{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #main_one_column2594 .nav01 dl>dt>a>div{ padding: 1em 1em 1em 1.3em; } /* smの時だけサイドバーの文字幅固定する */ #main_one_column2594 .nav01 dl>dt>a>div>span{ width: 80%; } #main_one_column2594 .nav01 dl>dt>a>div>span{ padding-right: 0.5em; margin-right: 0; display: block; float: left; text-decoration: underline; } #main_one_column2594 .nav01 dl dd a{ padding: 0.7em 1em 0.7em 2em; } #main_one_column2594 .nav01 dl dd a:hover{ color: #fff; background-color: #317f00; } #main_one_column2594 .nav01 dt.ac01 a{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } #main_one_column2594 .nav01 dd.ac02 a{ color: #fff; background-color: #317f00; } #main_one_column2594 .nav01 dt.ac03 a{ color: #fff; background: #317f00; /* Old browsers */ background: -moz-linear-gradient(top, #317f00 0%, #317f00 35%, #2b6f00 35%, #2b6f00 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#317f00), color-stop(35%,#317f00), color-stop(35%,#2b6f00), color-stop(100%,#2b6f00)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* IE10+ */ background: linear-gradient(to bottom, #317f00 0%,#317f00 35%,#2b6f00 35%,#2b6f00 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#317f00', endColorstr='#2b6f00',GradientType=0 ); /* IE6-9 */ } .set_inner{ position: static; } .set_inner .return_link{ position: static; } #apply-new .set_inner h3 { margin-bottom: 15px; } #apply-new .set_inner .return_link{ margin-bottom: 20px; text-align: right; } .page-id-2594 .right-box form input[type=image]{ width: 100%; } } /* contents/apply/presentation.htm 教材のご紹介 *********************************************************/ .inbox02{ padding: 0 1.2em; } .bana_set{ padding: 0 1.2em; } .inbox02 table { display: table; border-collapse: separate; border-spacing: 1px; border-color: gray; } .inbox02 table th,.inbox02 table td{ padding: 0.5em; } .page-id-132 #main .inbox02 table th{ font-weight: bold; } .page-id-132 #unitipmid{width:200px;} @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-132 label { padding: 10px; display: block; margin: 0; border: 1px solid #fff; } .page-id-132 input[type="checkbox"].on-off{ display: none; } .page-id-132 .menu ul { -webkit-transition: all 0.5s; -moz-transition: all 0.5s; -ms-transition: all 0.5s; -o-transition: all 0.5s; transition: all 0.5s; margin: 0; padding: 0; list-style: none; } .page-id-132 .menu ul li{ float: left; width: 50%; } .page-id-132 input[type="checkbox"].on-off + ul{ height: 0; overflow: hidden; } .page-id-132 input[type="checkbox"].on-off:checked + ul{ height: 345px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-132 input[type="checkbox"].on-off:checked + ul{ height: auto; } } /* /contents/apply/beginning.htm 初級編のご紹介 *********************************************************/ .pro_box { background-size: contain; width: 94%; } .pro_box_bot { background-size: contain; width: 100%; } .pro_cart_set { text-align: center; } .hidden-xs .layout_table{ width: 98%; margin-left: auto; margin-right: auto; } .fea_box { background-size: contain; width: 100%; } .fea_box_bot { background-size: contain; width: 100%; } .rec_set { background-size: contain; width: 100%; } .rec_set_bot { background-size: contain; width: 100%; padding: 0.5em; padding-bottom: 18px; } .st02_box { background-size: contain; width: 100%; } .pro_cont_title {/* 他のページでも使ってる */ height: 26px; padding-top: 5px; background-color: #EDEDED; background: url(/images/products/pro_cont_title.gif) 0 0 no-repeat; background-size: 670px; width: 670px; } beginning.htmmedi .st_box { background: url(/images/products/st_box_bg01.gif) 0 0 repeat-y; width: 607px; margin: 0 auto; } .chp02_item02 .layout_table th{ width: 15%; font-weight: bold; } .chp_item02 th{ font-weight: bold; width: 25%; } .fea_box img{ width: 100%; } .fea_box .title-img{/* 他のページでも使ってる */ width: 100%; } .rec_set .title-img{/* 他のページでも使ってる */ width: 100%; } .page-id-115 .pro_box_bot .layout_table { width: 98%; margin-left: auto; margin-right: auto; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .st_box_top { height: 202px; width: 643px; background-size: contain; background: url(/images/products/st_box_top.jpg) 0 0 no-repeat; color: #FFF; padding: 25px 40px 0px 200px; margin: 0 auto; text-align: left; } .st_box { background-size: contain; width: 607px; } .page-id-115.fb_iframe_widget { margin-left: 10px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .st_box_top { height: 160px; width: 540px; background-size: contain; background: url(/images/products/st_box_top.jpg) 0 0 no-repeat; color: #FFF; padding: 10px 30px 0px 150px; margin: 0 auto; text-align: left; font-size: 11px; margin-left: 5px; } .page-id-115 .st_box { background-size: contain; width: 480px; } .st_box_top { background-size: contain; width: 100%; } .st02_box_bot { background-size: contain; width: 100%; } .rec_set {/* 他でも使ってる */ margin-top: 18px; } .page-id-115 .rec_set { width: 235px; } .pro_cont_title {/* 他のページでも使ってる */ width: 486px; } .page-id-115 .m_l .m_s img{ width: 90%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .st_box_top { width: auto; } .rec_set{ margin-left: 0; margin-top: 10px; } .st_box { background: url(/images/products/st_box_bg01_xs.gif) 0 0 repeat-y; background-size: contain; width: 95%; } .page-id-115 .st_box { width: 90%; } .page-id-115 .visible-xs .st_box_top_xs{ background-color: #dcdcdc; padding: 1.5em; width: 94%; margin: 15px auto 0px; } .page-id-115 .visible-xs .layout_table table{ margin-top: 15px; } .pro_cont_title {/* 他のページでも使ってる */ height: 26px; padding-top: 5px; background-color: #EDEDED !important; background: url(/images/products/pro_cont_title_w_xs.gif) 0 0 no-repeat; border: solid 1px #CCC; } .pro_cont_title {/* 他のページでも使ってる */ width: 94%; } .pro01_list{ margin-bottom: 15px; } .page-id-115 .pro_box .form_xs form input[type=image]{ width: 100%; max-width: 142px; } .page-id-115 .rec_set { width: 100%; margin-left: auto; margin-right: auto; } } /* /contents/apply/beginning.htm 聴順直脳トレーニング *********************************************************/ .chp_item th { font-weight: bold; width: 30%; } .chp02_item th { font-weight: bold; width: 15%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .st_box_top06{ height: 202px; width: 643px; background-size: contain; background: url(/images/products/st_box_top06.jpg) 0 0 no-repeat; color: #ccc; padding: 25px 40px 0px 180px; margin: 0 auto; text-align: left; font-weight: normal; } .st_box02 { background-size: contain; width: 607px; } .st_box02_bot { background-size: contain; width: 100%; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .st_box_top06{ height: 160px; width: 540px; background-size: contain; color: #ccc; padding: 10px 70px 0px 140px; margin: 0 auto; text-align: left; font-weight: normal; font-size: 11px; } .page-id-2347 .st_box02 { background-size: contain; width: 480px; } .st_box02_bot { background-size: contain; width: 100%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-2347 .st_box_top06 { background: url(/images/products/st_box_top06.jpg) 0 0 no-repeat; background-size: contain; width: 100%; } .page-id-2347 .st_box02 { background-size: contain; width: 90%; } .page-id-2347 .visible-xs .st_box_top06_xs{ background-color: #dcdcdc; padding: 1.5em; width: 94%; margin: 15px auto 20px; margin-bottom: 20px; } .page-id-2347 .pro_cart_set .form_xs form input[type=image]{ width: 100%; max-width: 142px; } } /* /contents/apply/intermediate.htm 中級編のご紹介 *********************************************************/ .chp_item th { font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .st_box_top02 { background: url(/images/products/st_box_top02.jpg) 0 0 no-repeat; width: 643px; height: 202px; color: #ccc; padding: 25px 40px 0px 200px; margin: 0 auto; text-align: left; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .st_box_top02 { width: 540px; height: 160px; color: #ccc; padding: 10px 55px 0px 150px; margin: 0 auto; text-align: left; font-size: 11px; background-size: contain; } .page-id-174 .st_box { background-size: contain; width: 480px; margin-left: 15px; } .w90p{ width: 90%; margin-left: auto; margin-right: auto; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-174 .st_box_top02 { background-size: contain; width: 100%; } .page-id-174 .st_box { background-size: contain; width: 90%; margin-left: auto; margin-right: auto; } .visible-xs .st_box_top_xs{ background-color: #dcdcdc; padding: 1.5em; width: 94%; margin: 15px auto 0px; } .page-id-174 .visible-xs .layout_table table{ margin-top: 15px; } .page-id-174 .pro_cart_set .form_xs form input[type=image]{ width: 100%; max-width: 142px; } } /* /contents/apply/misono.htm 聴けて話せる英語実践セミナー *********************************************************/ .chp_item03 th { width: 25%; font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .pro_voice_box01 { height: 84px; } .pro_voice_box02 { height: 84px; } .pro_voice_box01 { width: 49%; } .pro_voice_box02 { width: 49%; } .st_box_top03 { background: url(/images/products/st_box_top03.jpg) 0 0 no-repeat; width: 643px; height: 202px; color: #CCC; padding: 24px 40px 0px 176px; color: #CCC; text-align: left; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .pro_voice_box01 { height: 100px; width: 48%; } .pro_voice_box02 { height: 100px; width: 48%; } .st_box_top03 { width: 517px; height: 160px; color: #CCC; padding: 10px 45px 0px 130px; color: #CCC; text-align: left; background-size: contain; font-size: 11px; } .page-id-186 .st_box02 { background-size: contain; width: 480px; } .page-id-186 .st_box02{ margin-left: 15px; } /* タブレットsmでのみ頭の「この教材の特徴」をfloatさせるため /contents/apply/kanamori.htmでも使用 */ .fea_box_sm{ overflow: hidden; padding: 0 20px 0 10px; } .fea_box_inner_sm{ margin-top: 10px; } .fea_box_sm .rec_set { margin-top: 10px; width: 100%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .pro_voice_box01 { height: auto; width: 48%; } .pro_voice_box02 { height: auto; width: 48%; } .st_box_top03 { width: 100%; } .page-id-186 .st_box02 { width: 90%; } .page-id-186 .visible-xs .st_box_top_xs{ margin: 15px auto 15px; } .page-id-186 .st_box02 { margin-left: auto; margin-right: auto; } .pro_voice_box01 { width: 100%; } .pro_voice_box02 { width: 100%; } .page-id-186 .pro_cart_set .form_xs form input[type=image]{ width: 100%; max-width: 142px; } } /* /contents/apply/kanamori.htm 大人のためのやり直し英語講座 *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .st_box_top04 { background: url(/images/products/st_box_top04.jpg) 0 0 no-repeat; width: 607px; height: 202px; color: #CCC; padding: 24px 15px 0px 176px; color: #CCC; text-align: left; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .st_box_top04 { background: url(/images/products/st_box_top04.jpg) 0 0 no-repeat; width: 480px; height: 160px; color: #CCC; padding: 15px 10px 0px 130px; color: #CCC; text-align: left; font-size: 11px; background-size: contain; } .st_box02 { background-size: contain; width: 93%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .st_box_top04 { width: 100%; } .st_box02 { width: 90%; } .page-id-205 .visible-xs .st_box_top_xs{ margin: 15px auto 15px; } .page-id-205 .pro_cart_set .form_xs form input[type=image]{ width: 100%; max-width: 142px; } } /* /contents/apply/business.htm スラスラ話せるオフィス英会話 *********************************************************/ .pro_box_inner table th{ text-align: center; } .std_box_bot { background-image: none; } .std_box_bot { width: 95%; margin: 0 auto 20px; background-image: none; } .page-id-215 .pro_info_box .m_l{ padding: 0; } .pro_box_inner { width: 94%; margin: 0 auto; } .pro_cont_title_ab{ width: 280px; } .bus_item_box { background-size: contain; width: 95%; } .bus_item_box_bot { background-size: contain; width: 100%; } .page-id-215 .bus_item_box_bot .ch_item{ width: 95%; } .page-id-215 .bus_item_box_bot .ch_item02{ width: 95%; } .st_item_bot .st_pic{ float: left; } .st_item_bot .st_prf{ padding-left: 10px; float: left; } /* 背景を */ .st_item_top,.st_item,.st_item_bot{ background-image: none; } .st_item{ background-color: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; width: 310px; padding: 0; padding-bottom: 10px; } .page-id-215 .st_item_top{ padding-top: 15px; } .pro_info_box .m_l{ padding: 0; } .pro_img { text-align: center; } .ch_item02 .layout_table { width: 100%; margin-top: 10px; } .page-id-215 .box_l{ width: 90%; } ul.pro05_list{ margin: 15px auto 15px; list-style-type: disc; } ul.pro05_list li{ list-style-type: disc; } .page-id-215 #ls01-md .pro_box_bot .pro_box_inner .layout_table{ width: 100%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .gif_box { width: 100%; margin: 0 auto; position: relative; } .gif_box .gif_arr { position: absolute; right: 120px; bottom: -60px; z-index: 3; } .pro_box_bot{ padding-left: 4px; padding-right: 4px; } .voice_box{ padding-left: 4px; padding-right: 4px; } .voice_box { width: 668px; margin: 0 auto; position: relative; } .voice_box .more_link { position: absolute; right: 27px; bottom: 30px; } h2.bus_title { width: 720px; height: 165px; padding: 52px 0 0 50px; background: url(/images/products/bg_title.jpg) no-repeat; font-size: 24px; font-weight: normal; text-align: left; margin: 0 0 10px; line-height: 1.6em; } .bus_box { width: 97%; margin: 0 auto 15px; } .bus_step { float: left; width: 140px; background: url(/images/products/o_step_bg.gif) repeat-y; } .bus_step .lis_btn { position: absolute; top: 108px; left: 25px; } .bus_step { position: relative; } h2.bus_title { background-size: contain; width: 100%; } .st_item .st_pic { width: 102px; height: 143px; } .pro_info_box { width: 380px; padding-top: 0; } .pro_data .pro_img { padding-top: 10px; width: 230px; } .bus_step p{ height: 60px !important; } ul.pro05_list{ margin-left: 45px; } .pro_cart_set { margin-top: 20px; } .page-id-215 .std_box{ margin-left: 20px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .gif_box { width: 100%; margin: 0 auto; position: relative; } .gif_box .gif_arr { position: absolute; right: 90px; bottom: -65px; z-index: 3; } .voice_box { width: 486px; margin: 0 auto; position: relative; } .voice_box .more_link { position: absolute; right: 27px; bottom: 30px; } h2.bus_title { background-size: contain; width: 517px; height: 120px; padding: 35px 0 0 35px; font-size: 19px; line-height: 1.5em; } .pro_box .voice_box{ width: 100%; } .pro_box_inner .layout_table{ width: 100%; } .page-id-215 .pro_box_bot{ text-align: center; } .st_item { width: 480px; background-size: contain; width: 100%; } .st_item .st_prf { width: 340px; } .st_item_top { background-size: contain; width: 100%; } .st_item_bot { background-size: contain; width: 100%; } .pro_cont_title_ab { width: 140px; } .std_box_top { background: url(/images/products/st_box_top_xs.gif) top left no-repeat; padding: 222px 0px 0px 0; background-color: #223156; } .std_box_top { padding: 163px 0px 0px 0; } .std_box_top { background-size: contain; width: 100%; } .bus_step { width: 93px; height: auto; background-size: contain; } .bus_box { width: 95%; } .st_item03{ margin-bottom: 15px; } .pro_info_box { width: 260px; padding-top: 0; } .pro_cart_set{ width: 170px; } .pro_data .pro_img { padding-top: 10px; } .bus_step p{ height: 100px !important; } .bus_step p.lis_btn{ height: auto !important; } .bus_item_box form input[type=image] { width: auto; } .bus_item_box .ch_list_item th{ width: 85px; padding-right: 10px; } .ch_item02 .ch_s_item td form input[type=image]{ width: 100%; } .bus_item_box .bus_set_table td .m_xs form input[type=image]{ width: 100%; } ul.pro05_list{ margin-left: 15px; } .pro_cart_set { margin-top: 35px; } .page-id-215 .std_box{ margin: 0 auto 20px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .gif_box .gif_arr{ visibility: hidden; } h2.bus_title { background: url(/images/products/bg_title_top.jpg) no-repeat; background-size: contain; width: 100%; height: auto; border: solid 1px #dcdcdc; padding: 30px 20px 15px 10px; box-shadow:rgba(222, 222, 222, 0.65098) 0px 0px 6px 3px; -webkit-box-shadow:rgba(222, 222, 222, 0.65098) 0px 0px 6px 3px; -moz-box-shadow:rgba(222, 222, 222, 0.65098) 0px 0px 6px 3px; } .h2_in{ border-left: solid 1px #d3d3d3; padding-left: 15px; font-size: 16px; } .st_item_xs{ background-color: #fff; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; padding: 10px; width: 90%; margin: 10px auto 10px; } .st_item_xs .st_pic{ min-width: 70px; width: 74px; } .std_box_top { padding: 0 0 10px 0; background-image: none; } .bus_step { width: 40%; background-size: contain; } .bus_step img{ width: 100%; background-size: contain; } .bus_box_all{ padding-left: 25px; } .pro_cont_title_ab{ border-radius: 5px; background-color: rgba(0,0,0,0.5); padding: 18px 15px 5px; color: #fff; } .pro_cont_title_ab { width: 100%; } .pro_info_box { width: auto; padding-top: 0; } .pro_cart_set{ width: auto; } .bus_step p{ height: auto !important; } .bus_step p.lis_btn{ height: auto !important; } .page-id-215 ul.pro05_list{ margin-left: 20px; } } /* /fukuri　/jtb 福利厚生倶楽部/CLUB CCI/クラブオフ会員専用 えらべる倶楽部会員専用 *********************************************************/ .page-id-2435 .set_list_bottom, .page-id-3714 .set_list_bottom { background-image: none; vertical-align: top !important; width: 577px; } .page-id-2435 .set_list_bottom>img, .page-id-3714 .set_list_bottom>img,{ vertical-align: top !important; } .page-id-2435 .ch_s_item, .page-id-3714 .ch_s_item{ margin-top: 10px; } .page-id-2435 .fukuri_text ul,.page-id-2435 .fukuri_text li, .page-id-3714 .fukuri_text ul,.page-id-3714 .fukuri_text li{ list-style-type: disc ; } .ch_item_box { margin-bottom: 30px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-2435 .w300, .page-id-3714 .w300{ width: 210px; padding: 0 15px 0; } .page-id-2435 .w300 img, .page-id-3714 .w300 img{ width: 100%; } .w380{ width: 360px; } .set_list_top { height: 30px; } .page-id-2435 .s_item .layout_table, .page-id-3714 .s_item .layout_table{ width: 100%; } .set_list_top { width: auto; } .page-id-2435 .set_list_bottom, .page-id-3714 .set_list_bottom{ width: auto; } .page-id-2435 .set_list, .page-id-3714 .set_list{ width: auto; } .page-id-2435 .ch_item02>.layout_table, .page-id-3714 .ch_item02>.layout_table{ width: 100%; } .ch_item_box .ch_item02 { width: 95%; } .ch_item_box .ch_item02 .ch_list_item>td>img{ width: 90%; } .lv_tab02_bottom { height: 22px; } .page-id-2435 .w320, .page-id-3714 .w320 { width: 250px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-2435 .ch_item02 .col-sm-14, .page-id-3714 .ch_item02 .col-sm-14{ padding-left: 18px } .page-id-2435 .right-box .set_inner .mida-strong, .page-id-3714 .right-box .set_inner .mida-strong{ font-size: 1.2em; color: #333; padding-bottom: 10px; } .all-table01, .all-table02{ margin-left: 10px; } .set_list_top { font-size: 12px; } .lv_box01_top { background-size: contain; width: 100%; } .lv_box01 { width: auto; } .set_inner { width: auto; } .lv_box01_bot { background-size: contain; } .set_list_top { background-size: contain; width: 90%; height: auto; } .page-id-2435 .set_list_bottom, .page-id-3714 .set_list_bottom { background-size: contain; width: 100%; } .page-id-2435 .set_inner, .page-id-3714 .set_inner { width: 427px; } .page-id-2435 .lv_box01, .page-id-3714 .lv_box01 { background-size: contain; width: 95%; } .page-id-2435 .set_list_top, .page-id-3714 .set_list_top { background-color: #dcdcdc; } .page-id-2435 .s_item_box, .page-id-3714 .s_item_box { width: 95%; } .page-id-2435 .s_item td.s_item_img, .page-id-3714 .s_item td.s_item_img { width:10%; } .page-id-2435 .s_item .s_item_det, .page-id-3714 .s_item .s_item_det { width: 35%; } .page-id-2435 .s_item .s_item_app, .page-id-3714 .s_item .s_item_app { width: 45%; } .page-id-2435 .s_item .s_item_det_box, .page-id-3714 .s_item .s_item_det_box { width: auto; } .page-id-2435 .s_item_box .s_item td, .page-id-3714 .s_item_box .s_item td { text-align: center; } .page-id-2435 .s_item .layout_table, .page-id-3714 .s_item .layout_table{ width: 100%; } .page-id-2435 .s_item_box .s_item, .page-id-3714 .s_item_box .s_item { width: auto; } .page-id-2435 .ch_item, .page-id-3714 .ch_item{ width: 95%; } .page-id-2435 .ch_item_box, .page-id-3714 .ch_item_box { width: auto; } .page-id-2435 .w300, .page-id-3714 .w300 { width: 150px; } .page-id-2435 .w380, .page-id-3714 .w380 { width: 200px; } .page-id-2435 .ch_item_box .ch_item, .page-id-3714 .ch_item_box .ch_item { width: 95%; } .page-id-2435 .ch_item_box_bot, .page-id-3714 .ch_item_box_bot { background-size: contain; width: 100%; } .page-id-2435 .ch_item_box .ch_item02, .page-id-3714 .ch_item_box .ch_item02 { width: auto; } .page-id-2435 .ch_item_box .ch_item02, .page-id-3714 .ch_item_box .ch_item02 { width: 95%; } .page-id-2435 .ch_item_box, .page-id-3714 .ch_item_box { background-size: contain; width: 100%; } .page-id-2435 .set_list, .page-id-3714 .set_list{ width: 90%; height: 73px; background-size: contain; } .page-id-2435 .set_list img, .page-id-3714 .set_list img{ width:90px; } .page-id-2435 .set_list .item01, .set_list02 .item01,.page-id-3714 .set_list .item01 { top: 7px; left: 3px; } .set_list .item02, .set_list02 .item02 { top: 7px; left: 103px; } .set_list .item03, .set_list02 .item03 { top: 7px; left: 200px; } .set_list .item04, .set_list02 .item04 { top: 7px; left: 300px; } .ch_item_box .ch_price { width: 140px; padding-right: 10px; } .page-id-2435 .ch_item_box form input[type=image], .page-id-3714 .ch_item_box form input[type=image] { width: 95%; } .page-id-2435 .set_list_top02, .page-id-3714 .set_list_top02 { height: 30px; padding: 6px 0px 0px 40px; font-size: 14px; color: #333; background: #dcdcdc url(/images/application-new/set_item_bg_top_icon.gif) 15px 10px no-repeat!important; border-top-left-radius: 3px; border-top-right-radius: 3px; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; } .page-id-2435 .set-top, .page-id-3714 .set-top { border: none; padding: 0; } .page-id-2435 .ch_item02 .layout_table, .page-id-3714 .ch_item02 .layout_table{ width: 100%; } .page-id-2435 .ch_item02 form input[type=image], .page-id-3714 .ch_item02 form input[type=image] { width: auto; } .s_item .s_item_det_box{ padding-right: 1em; } .s_item .s_item_det_box{ text-align: left; } #main .s_item .s_item_app .m_xs img{ margin-top: 10px; width: auto; } #main .s_item .s_item_app form input[type=image]{ width: auto; } .ch_item_box .ch_price { width: auto; padding-right: 0; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .s_item_box_bot { padding-bottom: 15px; } .page-id-2435 .right-box .set_inner .mida-strong, .page-id-3714 .right-box .set_inner .mida-strong{ font-size: 1.2em; color: #333; padding-bottom: 5px; margin-top: 20px } .page-id-2435 .set_inner, .page-id-3714 .set_inner { width: auto; } .page-id-2435 .s_item_box form input[type=image], .page-id-3714 .s_item_box form input[type=image]{ max-width: 174px; width: 90%; } .page-id-2435 .set_list_top02, .page-id-3714 .set_list_top02 { height: 30px; padding: 6px 0px 0px 40px; font-size: 14px; color: #333; background: #dcdcdc url(/images/application-new/set_item_bg_top_icon.gif) 15px 10px no-repeat!important; border-top-left-radius: 3px; border-top-right-radius: 3px; -webkit-border-top-left-radius: 3px; -webkit-border-top-right-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-topright: 3px; } .page-id-2435 .set-top, .page-id-3714 .set-top { border: none; padding: 0; } .page-id-2435 .ch_item02 .layout_table, .page-id-3714 .ch_item02 .layout_table{ width: 100%; } .page-id-2435 .ch_item02 form input[type=image], .page-id-3714 .ch_item02 form input[type=image] { width: auto; } .page-id-2435 .s_item_box .s_item, .page-id-3714 .s_item_box .s_item { width: 95%; } .s_item .s_item_det_box{ padding-right: 1em; } .s_item .s_item_det_box{ text-align: left; } #main .s_item .s_item_app .m_xs img{ margin-top: 10px; width: auto; } #main .s_item .s_item_app form input[type=image]{ width: auto; } .ch_item_box .ch_price { width: auto; padding-right: 0; } .all-table01, .all-table02{ margin-left: 5px; } } /* /contents/contact/comparison.htm 他の英会話教材との比較 *********************************************************/ .cop_table_top { background-size: contain; width: 100%; } .cop_table { background-size: contain; width: 100%; } .cop_table_bot{ background-size: contain; width: 100%; } .page-id-208 .layout_table{ width: 100%; } .page-id-208 #main .inbox02 table .th01 { width: 15%; } .page-id-208 #main .inbox02 table .th02 { width: 28%; } .page-id-208 #main .inbox02 table .th03,.page-id-208 #main .inbox02 table .th04,.page-id-208 #main .inbox02 table .th05 { width: 19%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-208 #main .inbox02 table .th03,.page-id-208 #main .inbox02 table .th04,.page-id-208 #main .inbox02 table .th05 { padding-top: 50px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-208 #main .inbox02 table .th03,.page-id-208 #main .inbox02 table .th04,.page-id-208 #main .inbox02 table .th05 { padding-top: 27px; } .page-id-208 .cop_table_bot .text-br{ display: none; } .page-id-208 #main .inbox02 table th,.page-id-208 #main .inbox02 table td{ vertical-align: top; padding-top: 62px; } .page-id-208 #main table td.pr_sel{ padding-top: 15px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-208 #main .inbox02 table th,.page-id-208 #main .inbox02 table td { padding-top: 15px; } .page-id-208 #main .inbox02 .pr_point { text-align: center; color: #F90; font-weight: bold; font-size: 1.5em; } .cop_table_xs table td{ border: solid 1px #ccc; text-align: center; background-color: #f8f6f0; vertical-align: top; } .page-id-208 .l30{ font-size: 1.5em; margin-right: 0.3em; padding-top: 0.3em; } .th1_02xs_in{ width: 90%; margin-left: auto; margin-right: auto; text-align: center; } .page-id-208 .th1_01xs,.page-id-208 .th1_03xs,.page-id-208 .th1_04xs,.page-id-208 .th1_05xs{ background-color: #a9a9a9; color: #fff; font-size: 1.5em; padding: 1em 0.5em 1em; text-align: center; } .page-id-208 .th1_02xs{ overflow: hidden; background-color: #063; color: #fff; } .page-id-208 .th2_xs{ background-color: #dddddd; text-align: center; vertical-align: top; } .cop_table_xs table td.pr_sel{ background-color: #fff; border-left: solid 7px #063; border-right: solid 7px #063; } .cop_table_xs table .pr_sel_last{ border-bottom: solid 7px #063; } .xs-text-left{/* 他のページでも使用 */ text-align: left; } } /* /contents/practice/ 学習ステップTOP *********************************************************/ .page-id-252 .layout_table { width: 95%; margin-left: auto; margin-right: auto; } .imp_box01 th { width: 40%; text-align: left; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .imp_text02 { font-weight: normal; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .imp_text02 { font-weight: normal; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .imp_text02 .m_l{ height: auto; } } /* /contents/practice/detail.htm — 学習ステップ詳細 *********************************************************/ .step_img{ text-align: center; } /* ↓layout.cssにあって、idを増やした為に追加することになったもの↓ */ .step_box #tab,.step_box #tab-sm,.step_box #tab-xs { background : url(/images/practice/tab_bg.gif) 1px 0 no-repeat; width : 600px; height : 82px; padding:0px 22px; } .step_box #tab li,.step_box #tab-sm li,.step_box #tab-xs li { float : left; } .step_box #tab li a,.step_box #tab-sm li a,.step_box #tab-xs li a { width : 75px; height : 72px; display : block; text-indent : -9999px; overflow:hidden; } .step_box #tab .tab1 a,.step_box #tab-sm .tab1 a,.step_box #tab-xs .tab1 a { background : url(/images/practice/stab01_off.gif) 0 0 no-repeat; } .step_box #tab .tab2 a,.step_box #tab-sm .tab2 a,.step_box #tab-xs .tab2 a { background : url(/images/practice/stab02_off.gif) 0 0 no-repeat; } .step_box #tab .tab3 a,.step_box #tab-sm .tab3 a,.step_box #tab-xs .tab3 a { background : url(/images/practice/stab03_off.gif) 0 0 no-repeat; } .step_box #tab .tab4 a,.step_box #tab-sm .tab4 a,.step_box #tab-xs .tab4 a { background : url(/images/practice/stab04_off.gif) 0 0 no-repeat; } .step_box #tab .tab5 a,.step_box #tab-sm .tab5 a,.step_box #tab-xs .tab5 a { background : url(/images/practice/stab05_off.gif) 0 0 no-repeat; } .step_box #tab .tab6 a,.step_box #tab-sm .tab6 a,.step_box #tab-xs .tab6 a { background : url(/images/practice/stab06_off.gif) 0 0 no-repeat; } .step_box #tab .tab7 a,.step_box #tab-sm .tab7 a,.step_box #tab-xs .tab7 a { background : url(/images/practice/stab07_off.gif) 0 0 no-repeat; } .step_box #tab .tab8 a,.step_box #tab-sm .tab8 a,.step_box #tab-xs .tab8 a { background : url(/images/practice/stab08_off.gif) 0 0 no-repeat; } .step_box #tab .tab1 a.active,.step_box #tab-sm .tab1 a.active,.step_box #tab-xs .tab1 a.active { background:url(/images/practice/stab01_on.gif) 0 0 no-repeat; } .step_box #tab .tab2 a.active,.step_box #tab-sm .tab2 a.active,.step_box #tab-xs .tab2 a.active { background:url(/images/practice/stab02_on.gif) 0 0 no-repeat; } .step_box #tab .tab3 a.active,.step_box #tab-sm .tab3 a.active,.step_box #tab-xs .tab3 a.active { background:url(/images/practice/stab03_on.gif) 0 0 no-repeat; } .step_box #tab .tab4 a.active,.step_box #tab-sm .tab4 a.active,.step_box #tab-xs .tab4 a.active { background:url(/images/practice/stab04_on.gif) 0 0 no-repeat; } .step_box #tab .tab5 a.active,.step_box #tab-sm .tab5 a.active,.step_box #tab-xs .tab5 a.active { background:url(/images/practice/stab05_on.gif) 0 0 no-repeat; } .step_box #tab .tab6 a.active,.step_box #tab-sm .tab6 a.active,.step_box #tab-xs .tab6 a.active { background:url(/images/practice/stab06_on.gif) 0 0 no-repeat; } .step_box #tab .tab7 a.active,.step_box #tab-sm .tab7 a.active,.step_box #tab-xs .tab7 a.active { background:url(/images/practice/stab07_on.gif) 0 0 no-repeat; } .step_box #tab .tab8 a.active,.step_box #tab-sm .tab8 a.active,.step_box #tab-xs .tab8 a.active { background:url(/images/practice/stab08_on.gif) 0 0 no-repeat; } /* ↑layout.cssにあって、idを増やした為に追加することになったもの↑ */ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .step_box #tab,.step_box #tab-sm,.step_box #tab-xs { background: url(/images/practice/tab_bg.gif) 1px 0 no-repeat; width: 645px; height: 82px; padding: 0px 22px; } .pra_footer .nav01 { background: url(/images/practice/ft_bg01.gif) 0 0 no-repeat; width: 690px; height: 58px; } #step .step h2 img,#step-sm .step h2 img,#step-xs .step h2 img{ width: 100%; } .step_comment{ width: 80%; margin-left: auto; margin-right: auto; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .pra_footer .nav01 { background: url(/images/practice/ft_bg01.gif) 0 0 no-repeat; width: 517px; height: 58px; background-size: contain; font-size: 10px; } #step .step .display,#step-sm .step .display,#step-xs .step .display { width: 517px; position: relative; } .step_comment{ min-height: 96px; } .step_comment{ width: 75%; margin-left: auto; margin-right: auto; } .step_box { background-size: contain; width: 100%; } .step_box #tab,.step_box #tab-xs,.step_box #tab-sm { width: 517px; background-size: contain; } .step_box #tab li a,.step_box #tab-sm li a,.step_box #tab-xs li a { width: 59px; } .step_box #tab .tab1 a.active,.step_box #tab .tab2 a.active,.step_box #tab .tab3 a.active,.step_box #tab .tab4 a.active,.step_box #tab .tab5 a.active,.step_box #tab .tab6 a.active,.step_box #tab .tab7 a.active,.step_box #tab .tab8 a.active { background-size: contain; } .step_box #tab-sm .tab1 a.active,.step_box #tab-sm .tab2 a.active,.step_box #tab-sm .tab3 a.active,.step_box #tab-sm .tab4 a.active,.step_box #tab-sm .tab5 a.active,.step_box #tab-sm .tab6 a.active,.step_box #tab-sm .tab7 a.active,.step_box #tab-sm .tab8 a.active { background-size: contain; } .step_box #tab-xs .tab1 a.active,.step_box #tab-xs .tab2 a.active,.step_box #tab-xs .tab3 a.active,.step_box #tab-xs .tab4 a.active,.step_box #tab-xs .tab5 a.active,.step_box #tab-xs .tab6 a.active,.step_box #tab-xs .tab7 a.active,.step_box #tab-xs .tab8 a.active { background-size: contain; } .step_box #tab .tab1 a,.step_box #tab .tab2 a,.step_box #tab .tab3 a,.step_box #tab .tab4 a,.step_box #tab .tab5 a,.step_box #tab .tab6 a,.step_box #tab .tab7 a,.step_box #tab .tab8 a { background-size: contain; } .step_box #tab-sm .tab1 a,.step_box #tab-sm .tab2 a,.step_box #tab-sm .tab3 a,.step_box #tab-sm .tab4 a,.step_box #tab-sm .tab5 a,.step_box #tab-sm .tab6 a,.step_box #tab-sm .tab7 a,.step_box #tab-sm .tab8 a { background-size: contain; } .step_box #tab-xs .tab1 a,.step_box #tab-xs .tab2 a,.step_box #tab-xs .tab3 a,.step_box #tab-xs .tab4 a,.step_box #tab-xs .tab5 a,.step_box #tab-xs .tab6 a,.step_box #tab-xs .tab7 a,.step_box #tab-xs .tab8 a { background-size: contain; } .step_box{ width: 517px; } .step .display { width : 645px; position : relative; } .step .display .prev { position : absolute; top : 100px; left : 20px; } .step .display .next { position : absolute; top : 100px; right : 20px; } .step_box #tab-sm { height: 59px; } .step_box #tab-sm li a{ height: 59px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .step_box_bot {/* 枠外し */ background: none; } .step_box {/* 枠外し */ background: none; } .pra_footer .nav01 { background: url(/images/practice/ft_bg01.gif) 0 0 no-repeat; width: 400px; height: auto; font-size: 10px; } #step .step .display,#step-sm .step .display,#step-xs .step .display { width: auto; } .step_comment{ min-height: 96px; } .step_comment{ width: 75%; margin-left: auto; margin-right: auto; } .step_box { background-size: contain; width: 100%; } .step_box #tab,.step_box #tab-sm,.step_box #tab-xs { width: 400px; background-size: contain; } .step_box #tab li a,.step_box #tab-sm li a,.step_box #tab-xs li a { width: 44px; } .page-id-254 #step .step .m_l,.page-id-254 #step-sm .step .m_l,.page-id-254 #step-xs .step .m_l{ padding-left: 1em; padding-right: 1em; } .page-id-254 #step .step .step_img,.page-id-254 #step-sm .step .step_img,.page-id-254 #step-xs .step .step_img{ margin-left: auto; margin-right: auto; } .step_box #tab .tab1 a.active,.step_box #tab .tab2 a.active,.step_box #tab .tab3 a.active,.step_box #tab .tab4 a.active,.step_box #tab .tab5 a.active,.step_box #tab .tab6 a.active,.step_box #tab .tab7 a.active,.step_box #tab .tab8 a.active { background-size: contain; } .step_box #tab-sm .tab1 a.active,.step_box #tab-sm .tab2 a.active,.step_box #tab-sm .tab3 a.active,.step_box #tab-sm .tab4 a.active,.step_box #tab-sm .tab5 a.active,.step_box #tab-sm .tab6 a.active,.step_box #tab-sm .tab7 a.active,.step_box #tab-sm .tab8 a.active { background-size: contain; } .step_box #tab-xs .tab1 a.active,.step_box #tab-xs .tab2 a.active,.step_box #tab-xs .tab3 a.active,.step_box #tab-xs .tab4 a.active,.step_box #tab-xs .tab5 a.active,.step_box #tab-xs .tab6 a.active,.step_box #tab-xs .tab7 a.active,.step_box #tab-xs .tab8 a.active { background-size: contain; } .step_box #tab .tab1 a,.step_box #tab .tab2 a,.step_box #tab .tab3 a,.step_box #tab .tab4 a,.step_box #tab .tab5 a,.step_box #tab .tab6 a,.step_box #tab .tab7 a,.step_box #tab .tab8 a { background-size: contain; } .step_box #tab-sm .tab1 a,.step_box #tab-sm .tab2 a,.step_box #tab-sm .tab3 a,.step_box #tab-sm .tab4 a,.step_box #tab-sm .tab5 a,.step_box #tab-sm .tab6 a,.step_box #tab-sm .tab7 a,.step_box #tab-sm .tab8 a { background-size: contain; } .step_box #tab-xs .tab1 a,.step_box #tab-xs .tab2 a,.step_box #tab-xs .tab3 a,.step_box #tab-xs .tab4 a,.step_box #tab-xs .tab5 a,.step_box #tab-xs .tab6 a,.step_box #tab-xs .tab7 a,.step_box #tab-xs .tab8 a { background-size: contain; } .step_box{ width: auto; } .step .display { width : auto; position: static; } .display-xs td{ text-align: center } .step .display .prev { position: static; } .step .display .next { position: static; } .step_box #tab,.step_box #tab-sm,.step_box #tab-xs { height: 45px; } .step_box #tab li a,.step_box #tab-sm li a,.step_box #tab-xs li a { height: 42px; } } /* /contents/practice/style.htm — 教材の特徴とお勧めの学習法 *********************************************************/ .stu_box .stu_img { padding-top: 10px; padding-left: 10px; } .stu_box { background-size: contain; width: 100%; } .stu_box .title-img{ background-size: contain; width: 100%; } .stu_box_bot { background-size: contain; width: 100%; } .page-id-265 .inbox { margin-bottom: 0px; } .ban_ans { margin: 0 auto 30px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .pra_footer .nav02 { background: url(/images/practice/ft_bg02.gif) 0 0 no-repeat; width: 690px; height: 58px; } .pra_nav li.pra02 a, .pra_nav li.pra03 a { padding: 10px 0px 0px 60px; } .pra_nav li.pra04 a { padding: 18px 0px 0px 50px; } .pra_nav li.pra05 a { padding: 10px 0px 0px 70px; } .page-id-265 .stu_gr .layout_table{ width: 95%; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .pra_footer .nav02 { background: url(/images/practice/ft_bg02.gif) 0 0 no-repeat; width: 517px; height: 58px; background-size: contain; font-size: 10px; } .pra_nav li.pra01 a { padding: 5px 0px 0px 25px; } .pra_nav li.pra02 a, .pra_nav li.pra03 a { padding: 5px 0px 0px 40px; } .pra_nav li.pra04 a { padding: 13px 0px 0px 30px; } .pra_nav li.pra05 a { padding: 5px 0px 0px 50px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-265 .stu_img{ margin-bottom: 15px; } .page-id-265 .next-bar{ margin-top: 1em; } } /* /contents/level/check.htm — 英語レベルチェック *********************************************************/ .lvch_box { background-size: contain; width: 100%; } .inbox02 { margin: 0 auto 30px; } .lvch_box_in{ width:90%; margin:0 auto; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .pra_footer .nav03 { width: 690px; height: 58px; } .pra_nav li.pra02 a, .pra_nav li.pra03 a { padding: 10px 0px 0px 60px; } .pra_nav li.pra04 a { padding: 18px 0px 0px 50px; } .pra_nav li.pra05 a { padding: 10px 0px 0px 70px; } .lvch_box { background-size: contain; width: 644px; } .lvch_box_in{ width:530px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .pra_footer .nav03 { width: 517px; height: 58px; background-size: contain; font-size: 10px; } .pra_nav li.pra01 a { padding: 5px 0px 0px 25px; } .pra_nav li.pra02 a, .pra_nav li.pra03 a { padding: 5px 0px 0px 40px; } .pra_nav li.pra04 a { padding: 13px 0px 0px 30px; } .pra_nav li.pra05 a { padding: 5px 0px 0px 50px; } .lv-play{ margin-bottom: 10px; } .lv-play img{ width: 80%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .lvch_box_title img{ width: 100%; } .lvch_box p img{ width: 100%; } } /* /contents/level/results1.htm — — 入門レベル,初級レベル,中級レベル *********************************************************/ .lv_ch .layout_table { width: 100%; } .lvre_box_inner { width: 93%; margin-left: auto; margin-right: auto; } .lvre_box { background-size: contain; width: 100%; } .lvre_box_bot { background-size: contain; width: 100%; } .title-img{ width: 100%; vertical-align: top; } .lvre_box{ width: 96%; } .need_table th { font-weight: bold; } .lv_voice_box_top { background-size: contain; width: 100%; } .lv_voice_box { background-size: contain; width: 100%; } .lv_voice_box_bot { background-size: contain; width: 100%; } .lv_voice_box th { width: 20%; } .inbox .lv_voice_box td { padding-top: 0; } .lv_res_title { font-size: 14.2px; font-weight: bold; padding-top: 8px; padding-bottom: 8px; } .grad_box{ margin-left: 0; margin-right: 0; width: 100%; } .grad_box .layout_table{/* 他のページでも使用 */ width: 100%; } .lv_ch table th{ font-weight: bold; width: 120px; } .page-id-275 .need_table th { padding-right: 0; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .lv_voice_box .layout_table{ width: 96%; margin-left: 10px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .grad_box .result{ font-weight: bold; border-bottom: 1px #CCC solid; padding-right: 15px; text-align: left; color: #C00; font-size: 1.2em; text-align: center; } .grad_box .lvre_list{ margin-top: 15px; } .lv_point{ text-align: right; } .lv_ch .lv_active th { width: 120px; } .lv_voice_box .layout_table{ width: 97%; margin-left: 10px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .lv_voice_box th { padding-left: 5px; } .lv_ch .lv_active th { width: 100px; font-size: 1.3em; } .lv_voice_box .layout_table{ width: 95%; margin-left: 10px; } } /* /contents/trial/ — 英会話教材の試聴 *********************************************************/ .tr_box { background-size: contain; width: 100%; } .tr_box_bot { background-size: contain; width: 100%; } .tr_bot_inner{ width: 94%; margin-left: auto; margin-right: auto; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .pra_footer .nav04 { width: 690px; height: 58px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .pra_footer .nav04 { width: 517px; height: 58px; background-size: contain; font-size: 10px; } .trial-play{ margin-bottom: 10px; text-align: center; } .trial-play img{ width: 328px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .trial-play img{ width: 80%; } } /* /contents/development/history.htm — 英会話教材開発ストーリー *********************************************************/ .st_list_box li { min-height: 32px; } .st_list_box { background-size: contain; width: 90%; } .st_list_box_top { background-size: contain; width: 100%; } .st_list_box_bot { background-size: contain; width: 100%; } .st_int_block{ width: 94%; } h2.st_int_title { background: url(/images/history/title_bg.gif) 0 0 no-repeat; padding-left: 15px; font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .st_list_box ul { width: 95%; padding-left: 65px; } .st_int_item dt, .st_int_item02 dt { background: url(/images/history/dd_bg.gif) 72px 5px no-repeat; } .pra_footer .nav05 { width: 690px; height: 58px; } .st_int_block h2.st_int_title span { padding: 30px 0px 28px 60px; } .st_list_box li { width: 100%; } .st_int_item dd { width: 524px; } .st_int_pic_set dd { width: 265px!important; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .pra_footer .nav05 { width: 517px; height: 58px; background-size: contain; font-size: 10px; } .st_int_item dt, .st_int_item02 dt { background: none; } .st_list_box ul { width: 95%; padding-left: 40px; } h2.st_int_title { background-size: contain; width: 100%; } .st_int_item dt, .st_int_item02 dt { width: 15%; } .st_int_item dd { width: 82%; } .int_pic img,.int_pic02 img { width: 100%; min-width: 100px; } .st_list_box li { width: auto; } .st_int_block h2.st_int_title { background-size: contain; width: 100%; } .st_int_block h2.st_int_title span{ width: 90%; padding: 20px 0px 10px 15px; margin-left: 30px; } .st_int_item02_smcyousei{ width: 18% !important; } .st_int_item02 dd { width: 250px !important; } .page-id-279 .st_int_item02 dd { width: 280px !important; } .st_int_item02 dt { width: 64px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-279 .st_list_box ul { width: 95%; padding-left: 35px; } .st_int_item dt, .st_int_item02 dt { background: none; } .page-id-279 .st_int_block h2.st_int_title span { padding: 27px 0px 20px 25px; margin-left: 25px; } } /* /contents/contact/for_beginners.htm 英語に自信のない入門者の皆さま （修正必要なしDBのみで修正） *********************************************************/ /* /contents/voice/ 受講者の声TOP *********************************************************/ .voice_title01,.voice_title02,.voice_title03 { font-weight: bold; font-size: 14.3px; height: 45px; padding-top: 12px; } .page-id-287 .voice_box01 table tr th{ width: 45%; } .page-id-287 .voice_box01 table tr th img{ padding-right: 20px; width: 100%; height: auto; } .page-id-287 .layout_table{ margin: 0; width: 97%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ /* イメージの大きさの指定 */ .page-id-287 .voice_box01 table tr th img.pic04png{ width: 210px; padding-right: 0; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-287 .voice_box01 table tr th img.pic04png{ width: 90%; padding-right: 0; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-287 .voice_box01 table tr th img.pic04png{ max-width: 210px; } } /* /contents/voice/interview1.htm — ユーザーインタビュー1,— ユーザーインタビュー2 *********************************************************/ .us_int_block h2.us_int_title{ font-weight: bold; border-bottom: dotted 1px #CCC; } .us_int_block h2.us_int_title span { background: none; } .page-id-309 .layout_table { width: 100%; } .us_int_item dt { width: 12%; } .us_int_item dd { width: 87%; } .us_int_text dt { width: 21%; } .us_int_text dd { width: 79%; } .us_int_item dd.int_ans { line-height: 19.5px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .us_int_pic_set dd { width: 300px!important; } .us_int_item dd{ line-height: 19px; } .history03 span br{ line-height: 28px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .us_int_block { width: 100%; } .us_int_block h2.us_int_title { width: 100%; } .int_pic_center { text-align: center; width: 100%; } .int_pic_center img{ width: 90%; } .us_int_item dd.int_ans { width: 87%; } .us_int_text dt { width: 16%; } .us_int_text dd { width: 84%; } .us_int_pic_set dd { width: 315px!important; } .history03 span br{ display: none; } .int_pic img{ width: 100%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .us_int_pic_set dd { width: 80%!important; } .history03 span br{ display: none; } .int_pic img,.int_pic02 img{ width: auto; } } /* /contents/voice/voice1x.htm — 「30日間英語脳育成プログラム」受講者の声,— 「スラスラ話せるオフィス英会話」受講者の声 *********************************************************/ .box_voice_inner { background: url(/images/voice/voice_top.gif) no-repeat; padding: 40px 40px 10px 40px; } h2.voice_title { font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .voice_photo img{ width: 100px; height: auto; min-width: 60px; } .voice_photo{ width: 104px; height: auto; min-width: 60px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_voice_inner { background-size: contain; width: 100%; } .voice_photo img{ width: 100%; min-width: 60px; } .voice_photo { width: 100%; min-width: 80px; } .voice_table td:first-child{ padding-right: 10px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .box_voice_inner { padding: 33px 30px 10px 33px; } } /* /contents/verify/ — 高い効果の証明 *********************************************************/ .bot-banner-button{/* 他のページでも使用 */ margin-top: 50px; } .bot-banner-button img{/* 他のページでも使用 */ margin-bottom: 5px; } .box_verify { background-size: contain; width: 90%; } .box_verify h2 { height: 74px; background-size: contain; padding: 20px 0 0 40px; } .verify_bottom img{ width: 100%; } .verify_illust { width: 65%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-317 .pro_voice_box01,.page-id-317 .pro_voice_box02{ width: 320px; } .page-id-317 .pro_voice_box02_last { height: 100px; } .page-id-317 .box_l { width: 100%; padding-left: 38px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-317 .pro_voice_box02_last { height: 128px; } /* タブレットとモバイルの時のデザイン変更↓ */ .box_verify h2{ background: none; padding: 0.5em 0.5em 0.5em 0.5em; height: auto; border-left: solid 5px #273d27; vertical-align: middle; } .box_verify .verify-h2box{ padding-bottom: 1em; border-bottom: dotted 1px #273d27; font-weight: bold; } .box_verify { padding: 1em 1em 2em 1em; background: none; background-color: #f8f8f8; border:1px solid rgb(204, 204, 204); box-shadow:rgba(217, 217, 217, 0.45098) 0px 0px 3px 3px; -webkit-box-shadow:rgba(217, 217, 217, 0.45098) 0px 0px 3px 3px; -moz-box-shadow:rgba(217, 217, 217, 0.45098) 0px 0px 3px 3px; border-bottom: solid 3px #ddce74; } /* タブレットとモバイルの時のデザイン変更↑ */ /* タブレットとモバイルの時の配置変更↓ */ .verify_illust { float: none; text-align: center; width: auto; margin: 0 0 1em 0; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-317 .pro_voice_box01,.page-id-317 .pro_voice_box02 { height: auto; } .page-id-317 .pro_voice_box01,.page-id-317 .pro_voice_box02{ width: 100%; } } /* /fukuri_business.htm スラスラ話せるオフィス英会話 *********************************************************/ .bus_step img{ vertical-align: bottom; } .bus_item_box_bot .ch_item02{ width: 95%; } .page-id-1294 .bus_item_box .m_l img, .page-id-3719 .bus_item_box .m_l img { vertical-align: top; } .page-id-1294 .ch_item, .page-id-3719 .ch_item { width: 95%; } .yomu_button{ width: 94%; margin-left: auto; margin-right: auto; } .page-id-1294 .fukuri_text ul,.page-id-1294 .fukuri_text li, .page-id-3719 .fukuri_text ul,.page-id-3719 .fukuri_text li { list-style-type: disc; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-1294 .ch_list_item td, .page-id-3719 .ch_list_item td { vertical-align: top; text-align: center; } .page-id-1294 .std_box, .page-id-3719 .std_box { margin: 0 auto 20px 20px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .voice_box .more_link { position: absolute; right: 15px; bottom: 20px; } .voice_box .more_link img{ width: 210px; } .bus_att { float: left; width: 253px; padding-left: 20px; text-align: left; } .bus_att audio{ margin-bottom: 10px; } .page-id-1294 .std_box { margin: 0 auto 20px } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .voice_box .more_link { position: static; } .voice_box { position: static; } .voice_box_xs_buttom{ margin-top: 25px; margin-bottom: 10px; margin-left: 15px; } .voice_box_xs_buttom img{ width: 60%; } .bus_item_box form input[type=image] { width: 100%; } .ch_list_item td { padding-right: 0; } .bus_att { width: 100%; padding-top: 20px; padding-left: 0; text-align: left; } .voice_box .more_link img{ width: auto; } } /* /fukuri_business-2.htm スラスラ話せるオフィス英会話 *********************************************************/ .pro_box_inner .layout_table{ width: 95%; margin-left: auto; margin-right: auto; } .page-id-1706 .box_l { width: 95%; padding-left: 0; } .page-id-1706 .ch_item02 .layout_table{ width: 100%; } .page-id-1706 .ch_item{ width: 95%; } .page-id-1706 .w260{ width: 35%; text-align: center; } .page-id-1706 .fukuri_text ul,.page-id-1706 .fukuri_text li{ list-style-type: disc; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-1706 .bus_box{ padding-left: 20px } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-1706 .bus_box{ padding-left: 20px } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-1706 .w260{ width: 45%; text-align: center; } .page-id-1706 .text-m-r5px{ padding-right: 5px; } } /* /topics/order_cod.html 代引き決済 *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .order_cod_inner{ padding-top: 180px; width: 530px; margin: 0 auto; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .order_cod_inner{ padding-top: 100px; width: 45%; margin: 0 auto; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .order_cod_inner{ padding-top: 50px; width: 85%; margin: 0 auto; } } /* /contents/topics/mistake.htm 間違いだらけの英会話学習法TOP *********************************************************/ h2.topics_title01,h2.topics_title02,h2.topics_title03 { height: 43px; font-weight: bold; font-size: 14px; } .page-id-319 .layout_table { width: 95%; margin-left: auto; margin-right: auto; } .imp_box01 th { width: 40%; text-align: left; padding-left: 10px; padding-right: 40px; } .topics_text02 { padding: 25px 5px 0px; text-align: left; color: #777; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .imp_box01 th { width: 40%; text-align: left; padding-left: 0px; padding-right: 15px; } } /* /contents/topics/true_false.htm — なぜあなたは英語が話せない? *********************************************************/ .topic_title { background: url(/images/topics/bg_title01_img.gif) 17px 17px no-repeat; background-color: #10440e; padding: 17px 0px 16px 45px; margin: 35px auto 20px; font-size: 1.7em; color: #FFF; text-align: left; font-weight: bold; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px; } .t_illust_right{ width: 51%; } .t_illust_right img{ min-width: 80px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-321 .topics_footer .nav01 { background: url(/images/topics/ft_bg01.gif) 0 0 no-repeat; width: 690px; height: 73px; } .topics_nav li.pra02 a { padding: 12px 0px 0px 45px; } .topics_nav li.pra03 a { padding: 12px 0px 0px 73px; } .topics_nav li.pra04 a { padding: 21px 0px 0px 87px; } .topics_nav li.pra05 a { padding: 21px 0px 0px 53px; } .t_illust_right{ width: 51%; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-321 .topics_footer .nav01 { background-size: contain; width: 517px; height: 55px; font-size: 10px; } .topics_nav li.pra01 a { padding: 13px 0px 0px 28px; } .topics_nav li.pra02 a { padding: 6px 0px 0px 28px; } .topics_nav li.pra03 a { padding: 6px 0px 0px 50px; } .topics_nav li.pra04 a { padding: 12px 0px 0px 58px; } .topics_nav li.pra05 a { padding: 12px 0px 0px 36px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/topics/test.htm — 小学生の英語問題がとけますか? *********************************************************/ .page-id-329 .box_test_q p:last-child{ padding-right: 20px; } .page-id-329 .line_box01{ width: 99%; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-329 .topics_footer .nav02 { background: url(/images/topics/ft_bg02.gif) 0 0 no-repeat; width: 690px; height: 73px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-329 .topics_footer .nav02 { background-size: contain; width: 517px; height: 80px; font-size: 10px; } .page-id-329 .test_q_table { width: 95%; } .page-id-329 table td.test_q { min-width: 55px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/topics/answer.htm — 小学生の英語問題がとけますか?(解答編) *********************************************************/ .box_test_in { width: 85%; margin-left: auto; margin-right: auto; } .box_test_a { background-size: contain; width: 100%; } .test_a { font-size: 18px; background: url(/images/topics/test_a.gif) no-repeat 50% 0; text-align: center; color: #fff; padding: 15px 0; font-weight: normal; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .topics_footer .nav03 { background: url(/images/topics/ft_bg03.gif) 0 0 no-repeat; width: 690px; height: 73px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .topics_footer .nav03 { background-size: contain; width: 517px; height: 80px; font-size: 10px; } table td.test_q{ min-width: 70px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ } /* /contents/topics/best_study.htm — 英会話教材の選び方 *********************************************************/ h2.topics_point01,h2.topics_point02,h2.topics_point03,h2.topics_point04 { height: 70px; font-weight: bold; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .topics_footer .nav04 { background: url(/images/topics/ft_bg04.gif) 0 0 no-repeat; width: 690px; height: 73px; } .topics_gray { width: 40%; text-align: center; padding: 10px 0 10px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .topics_footer .nav04 { background-size: contain; width: 517px; height: 80px; font-size: 10px; } .t_illust_right{ width:100%; } .t_illust_right img{ width:75%; margin-left: 60px; } .topics_gray { width: 90%; text-align: center; padding: 10px 0 10px; margin-left: 22px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .t_illust_right img{ width:100%; margin-left: 0; } .topics_gray { width: 100%; text-align: center; padding: 10px 0 10px; margin-left:0; } } /* /contents/report/ — 英語力アップレポート *********************************************************/ .page-id-340 .report_form_table th{ font-weight: bold; border-bottom: solid 3px #fff; } .page-id-340 .report_form_table td label{ font-weight: normal; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .topics_footer .nav05 { background: url(/images/topics/ft_bg05.gif) 0 0 no-repeat; width: 690px; height: 73px; } .report_top { background-size: contain; width: 666px; height: 397px; } .box_report01,.box_report02,.box_report03,.box_report04 { width: 680px; height: 183px; background-size: contain; width: 100%; margin-left: 20px; } .page-id-340 input,.page-id-340 textarea{ max-width: 270px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .topics_footer .nav05 { background-size: contain; width: 517px; height: 80px; font-size: 10px; } .report_top { background-size: contain; width: 517px; height: 308px; padding: 195px 0 0 93px; line-height: 1.95; font-size: 10px; } .box_report01,.box_report02,.box_report03,.box_report04 { width: 517px; height: 139px; background-size: contain; width: 100%; margin-left: 0; padding: 50px 10px 10px 105px; } .box_report01 { background-size: contain; width: 100%; } .box_report02 { background-size: contain; width: 100%; } .box_report03 { background-size: contain; width: 100%; } .box_report04 { background-size: contain; width: 100%; } .page-id-340 input,.page-id-340 textarea{ max-width: 230px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .box_report01,.box_report02,.box_report03,.box_report04 { width: 517px; height: 155px; background-size: contain; width: 100%; margin-left: 0; padding: 40px 10px 10px 60px; } .box_report01 { background: url(/images/report/point_01_res.gif) no-repeat; background-size: contain; width: 100%; } .box_report02 { background: url(/images/report/point_02_res.gif) no-repeat; background-size: contain; width: 100%; } .box_report03 { background: url(/images/report/point_03_res.gif) no-repeat; background-size: contain; width: 100%; } .box_report04 { background: url(/images/report/point_04_res.gif) no-repeat; background-size: contain; width: 100%; } .page-id-340 input,.page-id-340 textarea{ max-width: 200px; } } /* /contents/report/child_ans.htm — — 小学生の英語(解答編ダウンロード) *********************************************************/ @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .box_pdf_dl { width: 638px; height: 185px; background: url(/images/report/bg_pdf.gif) no-repeat; margin: 20px auto; position: relative; } .btn_dl { position: absolute; top: 58px; left: 179px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .box_pdf_dl { position: relative; } .btn_dl { position: absolute; top: 40px; left: 133px; } .btn_dl img{ width: 220px; height: 44px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-346 .btn_dl img { width: auto; height: auto; } .page-id-346 .box_pdf_dl { position: static; width: auto; height: auto; padding-bottom: 20px; } .page-id-346 .btn_dl { position: static; } .page-id-346 .btn_dl { padding-top: 5px; } } /* /contents/report/completion.htm — — レポート申し込み（ＤＢ上の幅をとっただけ） *********************************************************/ /* /contents/report/dl.htm — — レポートダウンロード（他のダウンロードページとＣＳＳ連携） *********************************************************/ /* /contents/apply/onlineeng.htm — オンライン英会話レッスン 親ページ: BackUp教材のお申し込みTOP *********************************************************/ .tokuten_info { width: 100%; } .tokuten_img { width: 48%; } .comp_text { width: 90%; } .tokuten_img_box .rec_set { width: 75%; margin: 30px auto 0px!important; } .tokuten_img_box { width: 44%; } .tokuten_img_box2 { width: 52%; } .page-id-2449 .rec_set_bot form input[type=image] { width: auto; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .page-id-2449 .rec_set_bot form input[type=image] { width: auto; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .page-id-2449 .rec_set_bot form input[type=image] { width: 95%; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .page-id-2449 .rec_set_bot form input[type=image] { width: auto; } .tokuten_img { width: 100%; } .tokuten_img_box { width: 90%; margin-left: auto; margin-left: auto; } .tokuten_img_box2 { width: 100%; } .tokuten_img_box img{ width: 90%; } .tokuten_img_box2 img{ width: 100%; } } .set_box{ margin-left: auto; margin-right: auto; } /* ここからメールマガジンバックナンバー archine.php */ /* /contents/mailmag/～ ここからメールマガジンバックナンバー ********************************************************************************/ .mailmag_title { font-weight: bold; width: 98%; } .mailmag_body { margin-bottom: 0px; } a { color: #666; text-decoration: none; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .col2_idx { margin-right: 1em; width: 327px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .col2_idx { margin-right: 1em; width: 230px; } .mailmag_title { padding: 5px 5px 5px 11px; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .col2_idx { width: 100%; } .mailmag_body { padding-left: 10px; } } /* ここから投稿ページ関係 archine.php */ /* /contents/column/index.htm 英話を話す100のヒントTOP,副7ページ（英語の学習・勉強法のヒント等） ********************************************************************************/ #top .column_nav .pre { float: left; width: 195px; height: 42px; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .column_text { width: 308px; } .column_list dt { width: 100px; } .column_list dd { width: 475px; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .column_text { width: 95%; } .column_list dt { width: 100px; } .column_list dd { width: 75%; } .imp_title06 { background: url(/images/improvement/title01_bg.png) 0 0 no-repeat; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .column_list dl { padding-left: 70px; padding-bottom: 10px; border-bottom: dotted 1px #999; } .column_list dt { clear: both; } .column_list dd { width: 100%; } .column_list dd { width: 100%; border-left: none; padding: 0; } } /* ここから投稿ページ関係 single.php */ /* 各投稿ページ ********************************************************************************/ .auther .belong { font-weight: normal; } .auther dd { display: block; -webkit-margin-start: 40px; } .auther .title { padding-top: 5px; } .column_title { font-weight: bold; } .auther { margin-top: 15px; margin-bottom: 25px; padding-right: 40px; } .box_column_inner { width: 96%; } .box_column_inner { background-size: contain; width: 100%; } .box_column { background-size: contain; width: 100%; } .single .box_column .title-img{ vertical-align: bottom; } .wp-pagenavi{ text-align: center; } .column_contents { margin-bottom: 5px; } #top .column_nav .pre { float: left; width: 195px; height: 43px; } #top .column_nav .nex { float: left; width: 195px; height: 43px; } #top .column_contents_inner{ margin-bottom: 30px; } /* 投稿の「Catharine Nagashima」のauther部分の順番をかえるため */ .postid-2636 .auther .name { float: none; } @media screen and (min-width: 985px) { /* 表示領域が985px以上の場合に適用するスタイル */ .column_nav { width: 430px; height: 46px; margin: 0 auto 20px; } .column_nav .pre a,.column_nav .nex a { width: 195px; height: 43px; } .bana_add ul, .bana_add li { padding-left: 10px; } #top .column_contents_inner{ width: 95%; margin-left: auto; margin-right: auto; } } @media screen and (max-width: 984px) { /* 表示領域が984px以下の場合に適用するスタイル */ .column_nav { width: auto; height: auto; margin: 0 auto 20px; } .column_nav .pre a,.column_nav .nex a { width: 195px; height: 43px; } .column_nav .pre { margin-left: 25px; } .bana_add li { width: 230px; } .auther dd { -webkit-margin-start: 15px; } .auther { padding-right: 20px; } #top .column_contents_inner{ width: 95%; margin-left: auto; margin-right: auto; } } @media screen and (max-width: 720px) { /* xs 表示領域が720px以下の場合に適用するスタイル */ .bana_add ul, .bana_add li{ text-align: center; } .bana_add li { width: auto; margin-right: 0; } .bana_add li:first-child{ margin-bottom: 0; } #top .column_nav .pre { float: none; padding: 0; border-left: none; text-align: center; margin-top: 20px; margin-left: auto; margin-right: auto; width: 195px; height: 43px; } #top .column_nav .nex { float: none; padding: 0; border-left: none; margin-left: auto; margin-right: auto; width: 195px; height: 43px; } .auther { padding-right: 10px; } .column_nav .pre_xs{ height: 34px; border-right: 1px #CCC solid; } .column_nav .nex_xs{ height: 34px; } #top .column_contents_inner{ width: 100%; margin-left: auto; margin-right: auto; } }