/* * * Templat BASIC form aishipR * * クラス値命名規則 * h:ヘッダー用 m:メイン用 s:サイドバー用 f:フッター用 p:汎用 * * Table Of Content * * 1-0 ALL Setting * 1-1 Webkit appearance * 1-2 Layout Setting * 2-0 Function Parts * 2-1 Clearfix * 2-2 Holizontal Item Block * 2-3 Vertical Item Block * 2-4 Facebook * 2-5 Button * 2-6 機能パーツ：商品カテゴリ * 2-7 グリッドナビ（スタイル:gridnav） * 2-8 非表示コンテンツ(FB/タグマネージャ等用) * 2-9 トグル機能アニメーション * 2-10 カテゴリ・商品詳細ページ 見出し部下線 * 2-11 機能パーツ：テキスト * 2-12 見出し * 2-13 Bootstrap Buttons UI kit * 2-14 Responsive Grid System * 3-0 Module * 3-1 Header * 3-1-1 サイトロゴ * 3-1-2 カート・マイページボタン * 3-1-3 ドロップダウンメニュー * 3-1-4 カート・ログインボタン * 3-1-5 メインメニュー * 3-1-6 検索フォーム * 3-2 Main * 3-2-1 Main IMAGE * 3-2-2 Half Banner * 3-2-3 PICK UP Item * 3-2-4 News & SNS * 3-2-5 ShopInformation * 3-2-6 Notice * 3-3 Aside * 3-3-1 Aside Check List * 3-3-2 Aside Login Form & Search Form * 3-3-3 Aside Banner * 3-3-4 Aside Login Form * 3-4 Footer * 3-4-1 Footer Site Map * 3-4-2 Page Top Btn * 3-4-3 CopyRight * 4-0 Page-Content * 4-1 Archive Page * 4-1-1 Free Area * 4-1-2 Pankuzu List * 4-1-3 Category View Mode * 4-1-4 Item PR Setting * 4-1-5 Cart Button * 4-1-6 Archive List Item * 4-1-7 Archive Thumbnail Item * 4-2 Item Page * 4-2-1 Item IMAGE * 4-2-2 Item Name * 4-2-3 Order Area * 4-2-4 Item Page Titile * 4-2-5 Item Explanation * 4-2-6 Item BuyForm * 4-2-7 System Button * 4-2-8 Item Text * 4-2-9 Item Gallary * 4-2-10 Review * 4-3 Free Page * 4-3-1 TOP PAGE * 4-4 Form Page * 4-4-1 Cart Button Reset * 4-4-2 Form Page * 4-4-3 Form Confirm Page * 4-4-4 Item Search Form * 4-5 MyPage * 4-5-1 Mypage Index * 4-5-2 Member Profile Editor * 4-5-3 Special Point * 4-6 News * 10-0 ALL Setting[ For SmartPhone ] * 10-1 Header * 10-1-3 ドロップダウンメニュー * 12-2 Holizontal Item Block * 13-1-5 メインメニュー * 13-2-2 Half Banner * 13-2-4 News & SNS * 13-2-5 ShopInformation * 13-4-1 Footer Site Map * 13-4-2 Page Top Btn * 14-1-2 Category Pankuzu * 14-1-7 Archive Thumbnail Item * 14-2-3 Order Area * 20-0 ALL Setting[ For Tablet ] * 20-1 Header * 20-1-3 ドロップダウンメニュー * 23-3-3 Aside Banner * 23-4-2 Page Top Btn * 30-0 ALL Setting[ For PC ] * 30-1 Header * 30-1-3 ドロップダウンメニュー * 32-9 トグル機能アニメーション * 33-3-1 Aside Check List * 34-4-1 Footer Site Map * 34-4-2 Page Top Btn */ /* 1-0 ALL Setting *----------------------------------------------------------------------*/ body { background-color: #ffffff;} #sysAll{ max-width: 100%; background-color: transparent; padding: 0; } #sysHeader, #sysMain, #sysAside, #sysFotoer { padding: 0 5px;} #sysWrap { margin: 0 auto; padding: 0; overflow: hidden; } #sysMain,#sysAside{ background-color: #fff;} #sysHeader,#sysFooter{ padding: 0; margin: 0;} #sysHeader{ background: #fff;} #sysFooter{ background-color: #999;} #sysFooter > div{ background-color: #ddd; margin: 0 auto; padding-bottom: 5px;} #sysMain{ line-height: 1.5;} /* 1-0 Wrapper Setting */ #sysFooter > div, .p-pagetop .sysContent, .p-topimg .sysContent, .h-sitelogo,.h-utilitybtn, .h-siteinfo, .h-subMenu, .h-mainMenu .sysContent, .h-search, #sysWrap { max-width: 960px; } /* 1-1 Webkit appearance */ input[type=search], input[type=submit] { -webkit-appearance: none; } /* 1-2 input Setting */ input[type=search] { -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0; line-height: 2.5; padding-left: 5px; } input[type=search]::-webkit-search-decoration { display: none; } input[type="radio"] { -webkit-appearance: none; display: inline-block; vertical-align: baseline; width: 20px; height: 20px; margin-right: 5px; border: 1px solid rgb(212,212,212); cursor: pointer; border-radius: 100%; } input[type="radio"]:checked{ background: #666; } /* 1-3 Content setting */ table { border-collapse: collapse; border-spacing: 0; } select{ height: 30px;} p { margin: 10px auto;} h1,h2,h3,h4,h5,h6{ font-size: inherit;} /* 1-2 Layout Setting */ /* Responsive Grid system */ .grid-row:after { content: ""; display: table; clear: both; } .grid-row { padding-bottom: 0em;} /* DEFAULT COLUMN STYLES */ .grid-col { display: block; float: left; margin-left: 2%; } .grid-col:first-child { margin-left: 0; } .grid-col.col-span6:nth-child(2n+1) { margin-left: 0; } .col-span1 { width: 8.33333333333%; } .col-span2 { width: 16.6666666667%; } .col-span3 { width: 25%; } .col-span4 { width: 33.3333333333%; } .col-span5 { width: 41.6666666667%; } .col-span6 { width: 50%; } .col-span7 { width: 58.3333333333%; } .col-span8 { width: 66.6666666667%; } .col-span9 { width: 75%; } .col-span10 { width: 83.3333333333%; } .col-span11 { width: 91.6666666667%; } .col-span12 { width: 100%; } .grid-col.col-span1 { width: 6.5%; } .grid-col.col-span2 { width: 15.0%; } .grid-col.col-span3 { width: 23.5%; } .grid-col.col-span4 { width: 32.0%; } .grid-col.col-span5 { width: 40.5%; } .grid-col.col-span6 { width: 49.0%; } .grid-col.col-span7 { width: 57.5%; } .grid-col.col-span8 { width: 66.0%; } .grid-col.col-span9 { width: 74.5%; } .grid-col.col-span10 { width: 83.0%; } .grid-col.col-span11 { width: 91.5%; } .grid-col.col-span12 { width: 100%; } /* 2-0 Function Parts *----------------------------------------------------------------------*/ /* 2-1 Clearfix */ .p-clearfix:after, .clearfix:after { content: ""; clear: both; display: block; } /* 2-2 Holizontal Item Block */ .sysContent .sysItemBlock .sysHorizontal { letter-spacing: -.4em; text-align: center; } .sysContent .sysItemBlock .sysHorizontal li { width: 25%; float: none; display: inline-block; letter-spacing: normal; margin: 0; text-align: center; vertical-align: top; } /* 2-3 Vertical Item Block */ /* 2-4 Facebook */ .fbcomments, .fb_iframe_widget, .fb_iframe_widget[style], .fb_iframe_widget iframe[style], .fbcomments iframe[style], .fb_iframe_widget span, .widget_facebook_likebox iframe { width: 100% !important;} /* 2-5 Button */ .btn { padding: 10px 20px; display: inline-block; margin-top: 10px; } .btn-info{ background: #666; color: #fff; } .btn-info:hover{ background: #999;} #sysMypageReminder #sysMain input[type=submit], .sysBackButton, .sysNextSubmit { background: #666; color: #fff; display: block; padding: 10px 15px; text-shadow: none; border-color: transparent; border-radius: 3px; width: 80%; height: 50px; margin: 0 auto; } /* 2-6 機能パーツ：商品カテゴリ */ .sysFuncItemCategory a { line-height: 1.75; border-bottom: 1px dotted #999; } .sysFuncItemCategory a:hover { background: #eee; } /* 2-7 グリッドナビ（スタイル:gridnav） */ .gridnav ul li:last-child { border-right: 0;} /* 2-8 非表示コンテンツ(FB/タグマネージャ等用) */ .h-code{ display: none;} /* 2-9 トグル機能アニメーション */ .h-subMenu .sysAccordionInitialHide { display: block!Important; position: relative; opacity: 0; z-index: -1; } .h-subMenu .sysAccordionInitialHide.active{ -webkit-transition: all .5s ease-out; transition: all .5s ease-out; opacity: 1; z-index: 999; } /* 2-10 カテゴリ・商品詳細ページ 見出し部下線 */ #sysItemDetail #sysMain .sysItemName, .sysExplanation > div > span, .sysRetailPrice, .sysReview > span { border-bottom: 1px dashed lightgray;} /* 2-11 機能パーツ：テキスト */ #sysMain .sysContent h3 { border-bottom: 1px dashed lightgray;} #sysMain .sysContent h3:before { content: "■"; padding-right: 10px; } /* 2-12 見出し */ .headline-1st { font-size: x-large; font-weight: bold; border-bottom: 1px dotted rgb(212,212,212); padding: 5px; } .headline-2nd { font-size: large; font-weight: bold; border-bottom: 1px dotted rgb(212,212,212); padding: 5px; margin-left: 15px; } .headline-3rd { font-size: medium; font-weight: bold; border-bottom: 1px dotted rgb(212,212,212); padding: 5px; margin-left: 30px; } /* 2-13 Bootstrap Buttons UI kit */ .btn{text-decoration:none;display:inline-block;margin-bottom:0;font-weight:400;text-align:center;vertical-align:middle;cursor:pointer;background-image:none;border:1px solid transparent;white-space:nowrap;padding:6px 12px;font-size:14px;line-height:1.42857143;border-radius:4px;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.btn.active:focus,.btn:active:focus,.btn:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px}.btn:focus,.btn:hover{color:#333;text-decoration:none}.btn.active,.btn:active{outline:0;background-image:none;-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn.disabled,.btn[disabled],fieldset[disabled] .btn{cursor:not-allowed;pointer-events:none;opacity:.65;filter:alpha(opacity=65);-webkit-box-shadow:none;box-shadow:none}.btn-default{color:#333;background-color:#fff;border-color:#ccc}.btn-default.active,.btn-default:active,.btn-default:focus,.btn-default:hover,.open .dropdown-toggle.btn-default{color:#333;background-color:#ebebeb;border-color:#adadad}.btn-default.active,.btn-default:active,.open .dropdown-toggle.btn-default{background-image:none}.btn-default.disabled,.btn-default.disabled.active,.btn-default.disabled:active,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled],.btn-default[disabled].active,.btn-default[disabled]:active,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default,fieldset[disabled] .btn-default.active,fieldset[disabled] .btn-default:active,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover{background-color:#fff;border-color:#ccc}.btn-default .badge{color:#fff;background-color:#333}.btn-primary{color:#fff;background-color:#428bca;border-color:#357ebd}.btn-primary.active,.btn-primary:active,.btn-primary:focus,.btn-primary:hover,.open .dropdown-toggle.btn-primary{color:#fff;background-color:#3276b1;border-color:#285e8e}.btn-primary.active,.btn-primary:active,.open .dropdown-toggle.btn-primary{background-image:none}.btn-primary.disabled,.btn-primary.disabled.active,.btn-primary.disabled:active,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled],.btn-primary[disabled].active,.btn-primary[disabled]:active,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary,fieldset[disabled] .btn-primary.active,fieldset[disabled] .btn-primary:active,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover{background-color:#428bca;border-color:#357ebd}.btn-primary .badge{color:#428bca;background-color:#fff}.btn-success{color:#fff;background-color:#5cb85c;border-color:#4cae4c}.btn-success.active,.btn-success:active,.btn-success:focus,.btn-success:hover,.open .dropdown-toggle.btn-success{color:#fff;background-color:#47a447;border-color:#398439}.btn-success.active,.btn-success:active,.open .dropdown-toggle.btn-success{background-image:none}.btn-success.disabled,.btn-success.disabled.active,.btn-success.disabled:active,.btn-success.disabled:focus,.btn-success.disabled:hover,.btn-success[disabled],.btn-success[disabled].active,.btn-success[disabled]:active,.btn-success[disabled]:focus,.btn-success[disabled]:hover,fieldset[disabled] .btn-success,fieldset[disabled] .btn-success.active,fieldset[disabled] .btn-success:active,fieldset[disabled] .btn-success:focus,fieldset[disabled] .btn-success:hover{background-color:#5cb85c;border-color:#4cae4c}.btn-success .badge{color:#5cb85c;background-color:#fff}.btn-info{color:#fff;background-color:#5bc0de;border-color:#46b8da}.btn-info.active,.btn-info:active,.btn-info:focus,.btn-info:hover,.open .dropdown-toggle.btn-info{color:#fff;background-color:#39b3d7;border-color:#269abc}.btn-info.active,.btn-info:active,.open .dropdown-toggle.btn-info{background-image:none}.btn-info.disabled,.btn-info.disabled.active,.btn-info.disabled:active,.btn-info.disabled:focus,.btn-info.disabled:hover,.btn-info[disabled],.btn-info[disabled].active,.btn-info[disabled]:active,.btn-info[disabled]:focus,.btn-info[disabled]:hover,fieldset[disabled] .btn-info,fieldset[disabled] .btn-info.active,fieldset[disabled] .btn-info:active,fieldset[disabled] .btn-info:focus,fieldset[disabled] .btn-info:hover{background-color:#5bc0de;border-color:#46b8da}.btn-info .badge{color:#5bc0de;background-color:#fff}.btn-warning{color:#fff;background-color:#f0ad4e;border-color:#eea236}.btn-warning.active,.btn-warning:active,.btn-warning:focus,.btn-warning:hover,.open .dropdown-toggle.btn-warning{color:#fff;background-color:#ed9c28;border-color:#d58512}.btn-warning.active,.btn-warning:active,.open .dropdown-toggle.btn-warning{background-image:none}.btn-warning.disabled,.btn-warning.disabled.active,.btn-warning.disabled:active,.btn-warning.disabled:focus,.btn-warning.disabled:hover,.btn-warning[disabled],.btn-warning[disabled].active,.btn-warning[disabled]:active,.btn-warning[disabled]:focus,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning,fieldset[disabled] .btn-warning.active,fieldset[disabled] .btn-warning:active,fieldset[disabled] .btn-warning:focus,fieldset[disabled] .btn-warning:hover{background-color:#f0ad4e;border-color:#eea236}.btn-warning .badge{color:#f0ad4e;background-color:#fff}.btn-danger{color:#fff;background-color:#d9534f;border-color:#d43f3a}.btn-danger.active,.btn-danger:active,.btn-danger:focus,.btn-danger:hover,.open .dropdown-toggle.btn-danger{color:#fff;background-color:#d2322d;border-color:#ac2925}.btn-danger.active,.btn-danger:active,.open .dropdown-toggle.btn-danger{background-image:none}.btn-danger.disabled,.btn-danger.disabled.active,.btn-danger.disabled:active,.btn-danger.disabled:focus,.btn-danger.disabled:hover,.btn-danger[disabled],.btn-danger[disabled].active,.btn-danger[disabled]:active,.btn-danger[disabled]:focus,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger,fieldset[disabled] .btn-danger.active,fieldset[disabled] .btn-danger:active,fieldset[disabled] .btn-danger:focus,fieldset[disabled] .btn-danger:hover{background-color:#d9534f;border-color:#d43f3a}.btn-danger .badge{color:#d9534f;background-color:#fff}.btn-link{color:#428bca;font-weight:400;cursor:pointer;border-radius:0}.btn-link,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link{background-color:transparent;-webkit-box-shadow:none;box-shadow:none}.btn-link,.btn-link:active,.btn-link:focus,.btn-link:hover{border-color:transparent}.btn-link:focus,.btn-link:hover{color:#2a6496;text-decoration:underline;background-color:transparent}.btn-link[disabled]:focus,.btn-link[disabled]:hover,fieldset[disabled] .btn-link:focus,fieldset[disabled] .btn-link:hover{color:#999;text-decoration:none}.btn-group-lg>.btn,.btn-lg{padding:10px 16px;font-size:18px;line-height:1.33;border-radius:6px}.btn-group-sm>.btn,.btn-sm{padding:5px 10px;font-size:12px;line-height:1.5;border-radius:3px}.btn-group-xs>.btn,.btn-xs{padding:1px 5px;font-size:12px;line-height:1.5;border-radius:3px}.btn-block{display:block;width:100%;padding-left:0;padding-right:0}.btn-block+.btn-block{margin-top:5px} /* 2-14 Responsive Grid System */ /* 12 COLUMN : RESPONSIVE GRID SYSTEM DEVELOPER : DENIS LEBLANC URL : http://responsive.gs VERSION : 3.0 LICENSE : GPL & MIT */ .row:after, .col:after, { content: ""; display: table; clear: both; } .row { padding-bottom: 0em;} /* DEFAULT COLUMN STYLES */ .col { display: block; float: left; } .span_1 { width: 8.33333333333%; } .span_2 { width: 16.6666666667%; } .span_3 { width: 25%; } .span_4 { width: 33.3333333333%; } .span_5 { width: 41.6666666667%; } .span_6 { width: 50%; } .span_7 { width: 58.3333333333%; } .span_8 { width: 66.6666666667%; } .span_9 { width: 75%; } .span_10 { width: 83.3333333333%; } .span_11 { width: 91.6666666667%; } .span_12 { width: 100%; } .gutters .col { margin-left: 2%;} .gutters .col:first-child { margin-left: 0; } .gutters .span_1 { width: 6.5%; } .gutters .span_2 { width: 15.0%; } .gutters .span_3 { width: 23.5%; } .gutters .span_4 { width: 32.0%; } .gutters .span_5 { width: 40.5%; } .gutters .span_6 { width: 49.0%; } .gutters .span_7 { width: 57.5%; } .gutters .span_8 { width: 66.0%; } .gutters .span_9 { width: 74.5%; } .gutters .span_10 { width: 83.0%; } .gutters .span_11 { width: 91.5%; } .gutters .span_12 { width: 100%; } /* 3-0 Module *----------------------------------------------------------------------*/ /* 3-1 Header*/ .h-siteinfo{ height: 40px; background-color: #fff; } .h-siteinfo h1 { color: #000;} /* 3-1-1 サイトロゴ */ .h-sitelogo { margin: 0 auto; background: #fff; padding-bottom: 5px; padding-left: 5px; } .h-sitelogo .sysContent { width: 200px; max-width: 50%; } /* 3-1-2 カート・マイページボタン */ .h-utilitybtn { margin: 0 auto; } .h-utilitybtn .sysContent{ width: 30%; float: right; position: relative; bottom: 40px; height: 40px; } /* 3-1-3 ドロップダウンメニュー */ .h-subMenu { position: relative; } .h-subMenu .sysAccordionInitialHide { position: absolute; background: rgb(0,0,0); background: rgba(0,0,0,0.5); right: 0; padding: 9px 10px; width: 100%; } .h-subMenu ul li { margin: 10px auto;} .h-subMenu .sysHeadline{ color: #e5e5e5; line-height: 60px; text-align: center; background: #666; } .h-subMenu .sysAccordion:after{ content:""; } /* 3-1-4 カート・ログインボタン */ .h-utilitybtn ul li{ margin-right: 2%; width: 48%!important; height: 40px; line-height: 40px; margin-bottom: 0; } .h-utilitybtn ul li.sysText a { border: 1px solid rgb(212,212,212); line-height: 36px; height: 36px; font-size: small; margin-top: 1px; } .h-utilitybtn ul li.sysText a:hover { background: rgb(212,212,212); } .h-utilitybtn ul li.sysText a:before { content: ""; width: 15px; height: 15px; display: inline-block; vertical-align: middle; margin-right: 5px; } .h-utilitybtn ul li.sysText:nth-child(1) a:before { background: url(/img/icon/icon-mypage.png); background-size: 100%; } .h-utilitybtn ul li.sysText:nth-child(2) a:before { background: url(/img/icon/icon-cart.png); background-size: 100%; } /* 3-1-5 メインメニュー*/ .h-mainMenu{ margin: 0 auto; background: #00afe5;} .h-mainMenu ul li:last-child a { border: 0; } .h-mainMenu ul { display: table; width: 100%; } .h-mainMenu ul li { display: table-cell; float: none; height: 50px; border-right: 1px solid; } .h-mainMenu ul li.sysText a { line-height: 1; border: none; white-space: normal; padding: 20px 0; margin: 0 auto; } .h-mainMenu .sysContent { margin: 0 auto; background: #fff; } /* 3-1-6 検索フォーム */ .h-search{ margin: 0 auto; position: relative; padding: 0 5px 0 ; } .h-search .sysItemSearchForm { display: table; width: 100%; } .h-search .sysItemSearchFormWord { display: table-cell; padding-right: 10px; width: 100%; vertical-align: top; } .h-search .sysItemSearchFormWord input{ height: 40px; border: 1px solid #c9c9c9; padding: 5px; vertical-align: bottom; } .h-search .sysSearchButton { width: 100px; padding: 6px; height: 40px; border: 1px solid #999; border-radius: 3px; margin: 0 auto; background-color: #999; } /* 3-1-7 Main Image */ .p-topimg{ background-color: #ddd; } .p-topimg .sysContent{ margin: 0 auto; padding: 5px; } /* 3-2 Main*/ /* 3-2-1 */ /* 3-2-2 Half Banner */ .p-banner ul { text-align: center; clear: both; margin: 10px auto; } .p-banner li { width: 49%; display: inline-block; } /* 3-2-3 PICK UP Item */ .p-pickup .sysContent { padding: 5px 0; } .p-pickup .sysContent .sysHorizontal li { padding: 0 2.5px; } /* 3-2-4 News & SNS */ .p-news .sysContent { line-height: 1.5;} .p-news li { padding-left: 10px;} /* 3-2-5 ShopInformation */ .p-shopInfo .sysContent{ text-align :center;} .shopinfo-inner { display: inline-block; width: 48%; width: -webkit-calc(50% - 10px); width: calc(50% - 10px); margin: 5px; padding-bottom: 10px; line-height: 1.5; overflow: hidden; vertical-align: top; text-align: left; } .shopinfo-inner h3 { font-size: 150%; border-bottom: 1px dotted #666; padding: 0 0 5px 0px; margin-bottom: 10px; } .shopinfo-inner .btn{ float: right; margin-right: 20px; } /* 3-2-6 Notice */ .p-notice .sysHeadline { background: #e60054; border-color: #e60054; text-align: center; font-weight: bold; } /* 3-3 Aside*/ /* 3-3-1 Aside Check List */ .s-checklist li { margin: 5px auto; padding-bottom: 10px; border-bottom: 1px dotted; } /* 3-3-2 Aside Login Form & Search Form */ .s-login { line-height: 1.75; } .s-login ul { text-align: center; } .s-login li { display: inline-block; width: 46%; line-height: 1.5; vertical-align: top; background: #666; } .s-login li a { color: #fff; text-decoration: none; padding: 10px; display: block; } .s-login input { width: 95%; margin: 5px auto; line-height: 2; display: block; } .s-login .sysLoginButton { border: none; padding: 5px; background: #666; color: #fff; margin: 10px auto; border-radius: 0; } .s-login a { text-decoration: none; display: inline-block; background: #666; text-align: center; padding: 5px 15px; margin: 5px; color: #fff; border-radius: 3px; } /* 3-3-3 Aside Banner */ .s-banner { margin-bottom: 10px;} .s-banner li { margin: 5px auto;} /* 3-3-4 Aside Login Form */ .s-search{ line-height: 1.75;} .s-search ul{ text-align: center;} .s-search input[type=search]{ width: 95%!important; margin: 5px auto; line-height: 2.5; display: block; } .s-search .sysItemSearchAndOr, .s-search .sysItemSearchFormCategory { text-align: center; } .sysSearchButton { border: none; padding: 10px; background: #666; color: #fff; width: 95%; display: block; margin: 10px auto; } /* 3-4 Footer*/ /* 3-4-1 Footer Site Map */ .f-sitemap ul li.sysText a { color: #fff; padding: 0; background: #666; display: block; border: 1px solid #ddd; text-align: center; } .f-sitemap ul li.sysText a:hover { background: #999; } /* 3-4-2 Page Top Btn */ .p-pagetop .btn { text-decoration: none; margin: 0 auto; display: block; text-align: center; padding: 20px; } /* 3-4-3 CopyRight */ .f-copyright { margin: 0 auto; text-align: center; padding: 20px 0; } .f-copyright .sysContent{ border-top: 1px solid #666; } /* 4-0 Page-Content *----------------------------------------------------------------------*/ /* 4-1 Archive Page */ /* 4-1-1 Free Area */ /* 4-1-2 Pankuzu List*/ .sysCategoryPankuzu, .sysItemCategoryPankuzu { font-size: small; margin-bottom: 5px; white-space: nowrap; overflow: hidden; background: #666; color: #fff; padding: 0 5px; } .sysCategoryPankuzu a, .sysItemCategoryPankuzu a { display: inline-block; background: #666; padding: 5px 10px; color: #fff; text-decoration: none; } .sysCategoryPankuzu a:hover, .sysItemCategoryPankuzu a:hover { background: #999; } /* 4-1-3 Category View Mode */ .sysItemCategoryCtl { font-size: small; } .sysItemCategoryCtl a { display: inline-block; padding: 2px 4px; background: #ddd; border: 1px solid #999; border-radius: 3px; text-decoration: none; margin: 2px 0; } /* 4-1-4 Item PR Setting */ .sysItemPr { font-size: small; padding: 0 5px; background: #fff; border: 1px solid #666; border-radius: 3px; display: inline-block; font-weight: bold; } /* 4-1-5 Cart Button */ .sysCartButton { border: none; padding: 10px; margin: 5px 0; border-radius: 5px; background-color: #666; color: #fff; cursor: pointer; } .sysCartButton:hover { background: #999; } /* 4-1-6 Archive List Item */ .sysItemList ul.sysList li .sysThumbnailImage { width: 40%; max-width: 200px; } /* 4-1-7 Archive Thumbnail Item */ .sysItemList ul.sysThumbnail li { display: inline-block; float: none; vertical-align: top; letter-spacing: normal; } .sysItemList ul.sysThumbnail { letter-spacing: -.4em; } .sysItemList ul.sysThumbnail input { width: 100%; padding: 10px 0; } /* 4-1-8 Deliveries Table */ ul.SysDeliveriesTable { border-style: solid; border-width: 0px; list-style: none; display: table; margin: 0; padding: 0; } ul.SysDeliveriesTable > li { display: table-row; } ul.SysDeliveriesTable > li > div { border-style: solid; border-width: 1px; display: table-cell; padding:10px; } /* 4-2 Item Page */ /* 4-2-1 Item IMAGE */ .sysThumbnailImage > span,.sysThumbnailImage > br { display: none;} .sysItemImages .sysImageList li{ display: inline-block; vertical-align: top; height: auto; width: 32%; line-height: 1; float: none; margin: 1% 0; } /* 4-2-2 Item Name */ .sysItemName h1 { font-size: x-large;} /* 4-2-3 Order Area */ .orderArea { letter-spacing: -.4em; text-align: center; } .orderArea > div { width: 50%; display: inline-block; letter-spacing: normal; text-align: left; vertical-align: top; padding-right: 20px; } .orderArea > .orderArea > div { width: 100%; display: block; } /* 4-2-4 Item Page Titile */ .sysItemName, .sysExplanation > div > span, .sysReview > span{ display: block; margin-bottom: 10px; font-size: large; } /* 4-2-5 Item Explanation */ .sysExplanation table { width: 100%; text-align: center; border: 1px solid #999; line-height: 2; } .sysExplanation thead { text-align: center; color: #fff; background: #999; } .sysExplanation td { font-size: small; text-align: left; padding-left: 10px; } /* 4-2-6 Item BuyForm */ #sysItemDetail .sysRetailPrice { font-weight: bold;} #sysItemDetail .sysPr { text-align: center;} #sysItemDetail .sysPr > span { display: inline-block;} #sysItemDetail .sysForm select { min-width: 190px; width: 75%; display: inline-block; float: right; } #sysItemDetail #sysVariation { overflow: hidden; margin: 5px auto; } #sysItemDetail #sysVariation >div { margin: 10px auto; overflow: hidden; } #sysItemDetail .sysNumArea button { display: inline-block; width: 48%; background: #666; padding: 10px; border: 1px solid #999; border-radius: 5px; color: #fff; } #sysItemDetail .sysNumArea { padding-top: 5px; clear: both; text-align: right; } #sysWishlist .sysButton, #sysItemDetail .sysCartButton { width: 98%; margin-left: 2%; } #sysItemDetail .sysShare { padding: 5px 0 0 2%;} #sysCartInForm { width: 100%;} /* 4-2-7 System Button */ .sysLoginButton, .sysButton { border: none; padding: 10px; margin: 5px 0; border-radius: 5px; background-color: #666; color: #fff; cursor: pointer; } .sysLoginButton, .sysButton:hover { background: #999; } .sysLoginButton{ display: block; width: 50%; margin: 10px auto; padding: 20px; } /* 4-2-8 Item Text */ .sysDescription,.sysImageDescription{ font-size: 0.75rem;} /* 4-2-9 Item Gallary */ .sysImageListSimple li { margin-bottom: 10px;} /* 4-2-10 Review */ .sysReview input{ background: #666; color: #fff; text-shadow: none; border: 1px solid #999; border-radius: 3px; display: block; padding: 10px; margin: 5px auto; width: 50%; } .sysReview > br { display: none; } .sysReviewHistoryList { padding: 0 10px; border: 1px solid lightgray; } .sysReviewHistoryList li { margin-bottom: 5px; border-bottom: 1px dashed lightgray; padding: 5px 0; } .sysReviewHistoryList li:last-child { border: none;} .sysNickname, .sysEvaluation { display: inline-block; padding: 0 10px 0 0; } .sysNickname { font-size: large; font-weight: bold; } .sysReviewDatetime { font-size: small; text-align: right; padding-right: 20px; } .sysReviewText { font-size: small;} /* 4-3 Free Page */ /* 4-3-1 TOP PAGE */ /* 4-4 Form Page */ /* 4-4-1 Cart Button Reset */ .sysCart #sysMain .sysNextSubmitArea .sysNextSubmit, .sysCart #sysMain input[type=submit], .sysCart #sysMain button[type=submit], .sysCart #sysMain button { background: #666; color: #fff; text-shadow: none; } .sysCartInDone{ margin: 0;} /* 4-4-2 Form Page */ #sysMemberRegisterRegister #sysMain h2, #sysMemberRegisterConfirm #sysMain h2, #sysMemberRegisterIndex #sysMain h2, #sysFormThanks #sysMain h2, #sysFormConfirm #sysMain h2, #sysFormIndex #sysMain h2 { border-bottom: 1px solid #999; background-color: #999; color: #ffffff; font-size: large; padding: 5px; } #sysMemberRegisterRegister #sysMain, #sysMemberRegisterConfirm #sysMain, #sysMemberRegisterIndex #sysMain, #sysFormThanks #sysMain, #sysFormConfirm #sysMain, #sysFormIndex #sysMain { border-color: #999; border-style: solid; border-radius: 0px; border-width: 1px; box-shadow: 1px 1px 1px gray; margin-bottom: 10px; padding: 0; } #sysMemberRegisterConfirm #sysMain > form, #sysMemberRegisterIndex #sysMain > form, #sysFormConfirm #sysMain > form, #sysFormIndex #sysMain > form { padding: 10px;} #sysMypageReminder #sysMain input, #sysMemberRegisterIndex #sysMain input, #sysFormIndex #sysMain input { line-height: 15px; padding: 5px; font-size: small; margin: 5px auto; } #sysMain input[type="email"], #sysMain input[type="number"], #sysMain input[type="password"], #sysMain input[type="tel"], #sysMain input[type="url"], #sysMain input[type="text"], #sysMain textarea { width: 100%; background: -webkit-gradient(linear, left top, left bottom, from(#EFEFEF), to(#FFFFFF)); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#FFEFEFEF', endColorstr='#FFFFFFFF'); border-radius: 5px 5px 5px 5px; border: #999999 1px solid; line-height: 100%; padding: 10px 0; } #sysMain textarea { min-height: 75px;} .sysZipcode button, .sysZipcode .sysFormField { display: inline-block;} .sysZipcode .sysFormLabel { display: block;} .sysZipcode .sysFormField { width: 200px;} .sysZipcode br{ display: none;} .sysBirthday input { width: auto!important;} /* 4-4-3 Form Confirm Page */ #sysMypageEditConfirm #sysMain .sysFormField, #sysMemberRegisterConfirm #sysMain .sysFormField, #sysFormConfirm #sysMain .sysFormField { border: 1px solid #999; line-height: 2; padding-left: 10px; font-size: small; border-radius: 3px; margin: 5px auto; min-height: 20px; } /* 4-4-4 Item Search Form */ .sysItemSearchForm > div { margin: 10px auto; width: 90%; text-align: left; } form.sysItemSearchForm { text-align: center; } .sysItemSearchForm > div.sysItemSearchFormWord { width: 95%; } /* 4-5 MyPage */ /* 4-5-1 Mypage Index */ .sysMypage #sysMain{ border-color: #999; border-style: solid; border-radius: 0px; border-width: 1px; box-shadow: 1px 1px 1px gray; margin-bottom: 10px; padding: 0; } .sysMypage #sysMain h2{ border-bottom: 1px solid #999; background-color: #999; color: #ffffff; font-size: large; padding: 5px; } .sysMypage #sysMain > form, .sysMypage #sysMain > div { padding: 5px 10px;} /* 購入履歴 */ .sysOrderList { border: 1px solid rgb(212,212,212); padding: 10px; max-height: 400px; overflow-y: scroll; } .sysOrderList li { border-bottom: 1px dotted rgb(212,212,212); margin-bottom: 5px; padding-bottom: 5px; } /* マイページボタン */ .sysMypageNav > form { display: inline-block; width: 49%; vertical-align: top; } .sysMypageNav .sysButton { width: 100%; display: block; line-height: 40px; font-size: 1rem; } /* 4-5-2 Member Profile Editor */ #sysMypageEditDelivery #sysMain > form, #sysMypageEditMember #sysMain > form{ padding: 10px;} #sysMypageEditDelivery #sysMain input, #sysMypageEditMember #sysMain input { line-height: 15px; padding: 5px; font-size: small; margin: 5px auto; } #sysMypageEditConfirm #sysMain > form { padding: 10px;} /* 4-5-3 Special Point */ .sysSpecialPoint { overflow: hidden; letter-spacing: -.4em; } .sysSpecialPoint > div:nth-child(2n) { width: 60%; } .sysSpecialPoint > div { display: inline-block; letter-spacing: normal; padding: 5px 10px; border-bottom: 1px solid #d5d5d5; } .sysSpecialPoint > div:nth-child(2n+1) { width: 40%; } /* 4-5-4 Coupon List */ .sysCoupon { border: 1px solid #d5d5d5; margin: 10px; } /* 4-6 News Page */ .news-row { border-color: #999; border-style: solid; border-radius: 0px; border-width: 1px; box-shadow: 1px 1px 1px gray; margin-bottom: 10px; } .news-row > h1 { border-bottom: 1px solid #999; background-color: #999; color: #ffffff; font-size: large; padding: 5px; background: -webkit-gradient(linear, left top, left bottom, from(), to()); background: -webkit-linear-gradient(top, , ); } .sysNewsDetail { padding: 10px 20px;} /* マイページ（複数配送先編集画面）*/ .sysSelectAddress a { display: block; text-decoration: none; border: 1px solid; padding: 10px; } .sysSelectAddress { margin: 10px 0; } .sysSelectAddress a:hover { background: #eee; } .sysConfirmButton input#open_dlg_edit_customer_info { width: 50%; } .opcCommonEditModeBlock { background: white!important; } .opcCommonEditLabel { border-left: 0px!important; } #sysMain input[type="email"],#sysMain input[type="text"], #sysMain textarea,#sysMain input[type="tel"]{ width: 95%!important; } body { font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; background-color: #fff; } .gridnav { margin-bottom: 5px; border: none; background: #fff; } .h-utilitybtn ul li.sysText { padding-top: 6px; } .h-utilitybtn ul li.sysText a { height: 18px; line-height: 18px; border: none; border-right: 1px solid #000; } .h-utilitybtn ul li.sysText:first-child a { border-left: 1px solid #000; } .h-utilitybtn ul li.sysText a:hover { background: transparent; } .h-utilitybtn ul li.sysText a:hover { color: #00afe5; } .h-mainMenu nav { border-right: none; } .h-mainMenu ul { display: block; } .h-mainMenu ul li { width: auto !important; border-right: none; vertical-align: middle; } .h-mainMenu ul li.sysText a { padding: 2px 18px; border-right: 1px solid #000; } .h-mainMenu ul li.sysText:last-child a { border-right: none; } .h-mainMenu ul li.sysText a:hover { color: #00afe5; } .h-subMenu .sysAccordionInitialHide { bottom: -20px; } .h-subMenu ul li { background: transparent; } .h-subMenu ul li.sysText a { padding: 30px 5px 5px; } .h-subMenu ul li a { line-height: 2; font-size: 15px; color: #000; } .h-subMenu ul li a:hover { color: #00afe5; } .h-subMenu ul li:nth-child(1) a { background: url(../img/product-details/icon_building.png) no-repeat top 5px center; } .h-subMenu ul li:nth-child(2) a { background: url(../img/product-details/icon_mail.png) no-repeat top 5px center; } .h-search .sysItemSearchFormWord input { height: 34px; border: 1px solid #ccc; } .h-search .sysSearchButton { height: 34px; font-size: 14px; border: 1px solid #00afe5; background-color: #00afe5; } .h-search .sysSearchButton:hover { color: #00afe5; background-color: #fff; } #sysMain { padding: 0 5px 60px 15px; } #sysAside { padding: 0 15px 0 5px; } .asideCnt { border: none; border-top: 1px solid #000; } .asideCnt .sysHeadline { border-bottom: none; background-color: #fff; color: #000; font-weight: bold; padding: 5px; } .s-login .sysContent { font-size: 14px; } .sysFuncMemberLogin.s-login .sysContent > div > a { font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: bold; font-size: 14px; background: #00afe5; } .sysFuncMemberLogin.s-login .sysContent > div > a:last-child { background: #b3b3b3; } .sysFuncMemberLogin.s-login .sysContent > div > a:hover { background: #b3b3b3; } .sysFuncMemberLogin.s-login .sysContent > div > a:last-child:hover { background: #cfcfcf; } .s-login .sysLoginButton { padding: 5px; font-weight: bold; background: #ffa14a; border: 1px solid #ffa14a; border-radius: 5px; } .s-login .sysLoginButton:hover { color: #ffa14a; background: #fff; } .s-login ul { display: table; } .s-login li { vertical-align: middle; } .s-login li a { display: table-cell; height: 54px; padding: 2px 5px; vertical-align: middle; font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: bold; border-radius: 5px; } .s-login li:first-child { color: #fff; background: #00afe5; } .s-login li:first-child { color: #fff; background: transparent; } .s-login li:first-child a { color: #fff; background: #00afe5; border: 1px solid #00afe5; } .s-login li:first-child a:hover { color: #00afe5; background: #fff; } .s-login li:last-child { background: transparent; } .s-login li:last-child a { line-height: 1.2; color: #00afe5; background: #fff; border: 1px solid #00afe5; } .s-login li:last-child a:hover { color: #fff; background: #00afe5; } .asideCnt { padding: 10px 0 20px; } .sysFuncItemCategory a { border-color: #00afe5; } .s-category ul li.sysText a { padding: 5px 5px 5px 25px; background: url(../img/product-details/icon_list_mark.png) no-repeat left 8px center; } .s-case ul li.sysText a { padding: 5px 5px 5px 25px; background: url(../img/product-details/icon_list_mark.png) no-repeat left 8px center; } .s-category ul li.sysText a:hover, .s-case ul li.sysText a:hover { color: #00afe5; } .s-checklist li { border-color: #b3e0f5; } .s-checklist li > div { width: 100%; } .s-checklist li > div a { font-size: 15px; color: #00afe5; text-decoration: none; } .s-checklist li > div.sysItemName a { font-size: 15px; } .s-checklist li > div a:hover { color: #666; } #sysWrap { padding-top: 30px; } #sysFooter { padding: 30px 0 0; background-color: #b3e0f5; } .p-shopInfo .sysContent { padding: 0 10px 10px; background-color: #b3e0f5; } .footerCnt .sysHeadline { position: relative; margin-right: 10px; margin-left: 10px; border-bottom: 1px solid #fff; background-color: #b3e0f5; } .footerCnt .sysHeadline:after { content: ""; display: block; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 36px; height: 6px; background: url(../img/product-details/ttl_deco_wt.png) no-repeat center center; } .shopinfo-inner { width: calc(50% - 22px); padding-top: 30px; } .shopinfo-inner:nth-child(2n+1) { margin: 5px 20px 5px 0; } .shopinfo-inner:nth-child(2n) { margin: 5px 0 5px 20px; } .shopinfo-inner h3 { padding-left: 10px; border-color: #000; font-size: 140%; } .shopinfo-inner p { margin-left: 10px; padding-left: 0; font-size: 120%; } .shopinfo-inner p.indent { padding-left: 1em; } .shopinfo-inner ul { margin-bottom: 0; } .shopinfo-inner ul li { margin-bottom: 10px; margin-left: 10px; padding-left: 1em; text-indent: -1em; font-size: 120%; } .shopinfo-inner ul li:last-child { margin-bottom: 0; } .btn-default { padding-right: 30px; color: #000; border: none; border-radius: 5px; background: #fff url(../img/product-details/icon_arrow_right.png) no-repeat right 10px center; } .shopinfo-inner .btn { margin-top: 15px; } .shopinfo-inner .btn:hover { background-color: #f2f2f2; } #sysFooter > div { padding-bottom: 0; background-color: transparent; } #sysFooter > div.p-pagetop { padding-top: 20px; padding-bottom: 20px; } #sysFooter > div.f-copyright { max-width: 100%; } .p-pagetop .btn { font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: bold; color: #fff; background: #00afe5 none; } .p-pagetop .btn:hover { color: #00afe5; background-color: #fff; } .f-copyright .sysContent { color: #fff; border-top: none; background-color: #333; } .p-topimg { background-color: transparent; } .sysFuncBanner.p-topimg { max-width: 950px; margin: 0 auto 10px; padding-top: 10px; } .sysFuncBanner.p-topimg ul { padding-top: 0; } .slide-items { width: 100%; height: 100%; } .slide-items img { width: 100%; object-fit: cover; } .slick-dots li button:before { font-size: 10px; } .slick-dots { bottom: -35px; } .sysFuncBanner.p-topimg ul li:nth-of-type(1), .sysFuncBanner.p-topimg ul li:nth-of-type(2), .sysFuncBanner.p-topimg ul li:nth-of-type(3), .sysFuncBanner.p-topimg ul li:nth-of-type(4), .sysFuncBanner.p-topimg ul li:nth-of-type(5) { animation: none; } .mainCnt, .for-corporations, .news-row { margin-bottom: 50px; border-width: 0; box-shadow: 0 0 0 #fff; } .mainCnt .sysHeadline, .for-corporations .sysHeadline, .news-row > h1 { position: relative; margin-bottom: 40px; padding: 5px; font-size: 26px; color: #000; border-bottom: 1px solid #000; background-color: transparent; } .mainCnt .sysHeadline:after, .for-corporations .sysHeadline:after, .news-row > h1:after { content: ""; display: block; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 36px; height: 6px; background: url(../img/product-details/ttl_deco.png) no-repeat center center; } .p-news ul li { padding-left: 0; } .p-news ul li + li { border-top: 1px dotted #00afe5; } .p-news ul li a { padding: 8px 5px; line-height: px; font-weight: bold; font-size: medium; color: #3399cc; text-overflow: ""; white-space: normal; overflow: auto; } .p-news ul li a:hover { text-decoration: underline; } .p-pickup .sysContent .sysHorizontal, .sysContent .sysItemBlock .sysHorizontal { display: flex; flex-wrap: wrap; } .p-pickup .sysContent .sysHorizontal li { display: flex; flex-direction: column; padding: 0 10px; } .sysContent .sysItemBlock .sysHorizontal li { display: flex; flex-direction: column; padding: 0 10px 40px; } .p-pickup .sysContent .sysHorizontal .sysItemImage, .p-newItem .sysContent .sysHorizontal .sysItemImage { margin-bottom: 10px; } .p-pickup .sysContent .sysHorizontal .sysItemImage img, .p-newItem .sysContent .sysHorizontal .sysItemImage img { width: auto; height: 160px; } .sysHorizontal .sysItemName { margin-bottom: 15px; font-size: 16px; } .sysHorizontal .sysItemName a { text-decoration: none; } .sysHorizontal .sysItemName a:hover { color: #00afe5; } .sysHorizontal .sysItemPrice { margin-top: auto; font-size: 14px; } .mainCnt.p-notice { text-align: center; } .mainCnt.p-notice .sysHeadline { margin-bottom: 20px; padding-bottom: 0; font-size: 20px; color: #000; border-bottom: none; display: none; } .mainCnt.p-notice .sysHeadline:after { display: none; } .mainCnt.p-notice .for-corporations-info { margin-bottom: 40px; padding: 20px; background-color: #f2f2f2; } .mainCnt.p-notice .for-corporations-info p { margin: 0 auto 12px; font-weight: bold; font-size: 15px; } .mainCnt.p-notice .for-corporations-info p { margin: 0 auto 12px; font-weight: bold; font-size: 15px; } .mainCnt.p-notice .for-corporations-info p.for-corporations-btn { margin-bottom: 0; } .mainCnt.p-notice .for-corporations-info p.for-corporations-btn a { display: inline-block; width: 260px; height: 38px; line-height: 38px; padding: 0 20px; font-weight: bold; font-size: 14px; color: #fff; text-decoration: none; background-color: #00afe5; border: 1px solid #00afe5; border-radius: 5px; } .mainCnt.p-notice .bnr-area p { margin: 0 auto 10px; line-height: 0; } .sysCategoryPankuzu, .sysItemCategoryPankuzu { position: relative; margin-bottom: 20px; padding: 0 0 10px; color: #000; background: transparent; border-bottom: 1px solid #000; } .sysCategoryPankuzu:after, .sysItemCategoryPankuzu:after { content: ""; display: block; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 999; width: 36px; height: 6px; background: url(../img/product-details/ttl_deco.png) no-repeat center center; } .sysCategoryPankuzu a, .sysItemCategoryPankuzu a { margin: 0 10px; padding: 6px 20px; font-size: 14px; color: #3399cc; background: #f2f6f7; border-radius: 30px } .sysCategoryPankuzu a:first-child, .sysItemCategoryPankuzu:first-child a { margin-left: 0; } .sysCategoryPankuzu a:hover, .sysItemCategoryPankuzu a:hover { background: #ccc; } #sysItemDetail #sysMain .sysItemName { margin-bottom: 20px; border-bottom: none; } .orderArea > div { font-size: 14px; } #sysItemDetail .sysRetailPrice { margin-bottom: 10px; border: none; } #sysItemDetail .sysForm select { min-width: 180px; width: 70%; padding: 5px 8px; color: #000; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 5px } #sysItemDetail .sysSelectionDescription { clear: both; } .sysSelectionDescription { padding-top: 10px; padding-bottom: 20px; font-size: 15px; } #sysItemDetail .sysNumArea { padding-top: 10px; } #sysItemDetail .sysNumArea button { background: #333; border: 1px solid #333; } .sysCartButton.sysAddGoCartButton { background: #bf0000 url(../img/product-details/icon_cart.png) no-repeat left 70px center; border: 1px solid #bf0000; } .sysCartButton.sysAddGoCartButton:hover { color: #fff; background: rgba(191,0,0,0.7) url(../img/product-details/icon_cart.png) no-repeat left 70px center; } .sysRetailPrice { margin-bottom: 15px; padding-bottom: 15px; } .sysAddSelection select { color: #000; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 5px } .sysExplanation { padding-top: 20px; } .sysExplanation > div > span { font-size: 22px; border: none; } /* フォーム */ #sysFormIndex #sysMain, #sysFormConfirm #sysMain, #sysFormThanks #sysMain, #sysMemberRegisterIndex #sysMain, #sysMemberRegisterConfirm #sysMain, #sysMemberRegisterRegister #sysMain, #sysMypageLogin #sysMain, .sysMypage #sysMain { border-width: 0; box-shadow: 0 0 0 gray; padding: 0 0 100px 10px; } #sysFormIndex #sysMain h2, #sysFormConfirm #sysMain h2, #sysFormThanks #sysMain h2, #sysMemberRegisterIndex #sysMain h2, #sysMemberRegisterConfirm #sysMain h2, #sysMemberRegisterRegister #sysMain h2, #sysMypageLogin #sysMain h2, .sysMypage #sysMain h2 { position: relative; margin-bottom: 40px; padding: 5px; color: #000; font-size: 26px; border-bottom: 1px solid #000; background-color: transparent; } #sysFormIndex #sysMain h2:after, #sysFormConfirm #sysMain h2:after, #sysFormThanks #sysMain h2:after, #sysMemberRegisterIndex #sysMain h2:after, #sysMemberRegisterConfirm #sysMain h2:after, #sysMemberRegisterRegister #sysMain h2:after, #sysMypageLogin #sysMain h2:after, .sysMypage #sysMain h2:after { content: ""; display: block; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 36px; height: 6px; background: url(/img/product-details/ttl_deco.png) no-repeat center center; } #sysFormThanks #sysMain h2 { margin-bottom: 30px; } #sysMemberRegisterIndex #sysMain .sysFreeArea { margin-bottom: 20px; padding: 10px 0; } #sysMemberRegisterIndex #sysMain .sysMemberAgreement { margin: 5px 10px; padding: 15px; border: 1px solid #ccc } .sysFormItem { padding-bottom: 20px; } .sysFormItem.sysMailaddress, .sysFormItem.sysMemberPassword { padding-bottom: 2px; } .sysFormItem.sysMailaddress .sysFormField, .sysFormItem.sysMemberPassword .sysFormField { padding-bottom: 0; } #sysMemberRegisterIndex .sysFormItem.sysMemberPassword .sysFormField { padding-bottom: 10px; } #sysMemberRegisterConfirm .sysFormItem.sysMailaddress { padding-bottom: 20px; } .sysFormItem.sysName { padding-top: 30px; } .sysMemberPasswordDescription { padding-bottom: 10px; } #sysMain input[type="email"], #sysMain input[type="number"], #sysMain input[type="password"], #sysMain input[type="tel"], #sysMain input[type="url"], #sysMain input[type="text"], #sysMain textarea { width: 100% !important; } #sysFormIndex #sysMain input, #sysMemberRegisterIndex #sysMain input, #sysMypageLogin #sysMain input, .sysMypage #sysMain input { padding: 5px; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)); background-color: #fff; border: 1px solid #ccc; border-radius: 3px } #sysFormIndex #sysMain textarea, #sysMemberRegisterIndex #sysMain textarea, #sysMypageLogin #sysMain textarea, .sysMypage #sysMain textarea { padding: 5px; line-height: 1.5; font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-size: 14px; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)); background-color: #fff; border: 1px solid #ccc; border-radius: 3px } #sysFormIndex #sysMain select, #sysMemberRegisterIndex #sysMain select, .sysMypage #sysMain select { color: #000; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 5px } #sysFormIndex #sysMain .sys3 .sysFormField input[type="text"] { width: 210px !important; } #sysFormIndex #sysMain input[type="checkbox"], #sysMemberRegisterIndex #sysMain input[type="checkbox"], #sysMypageLogin #sysMain input[type="checkbox"], .sysMypage #sysMain input[type="checkbox"] { margin-right: 5px; } #sysMypageEditConfirm #sysMain .sysFormField, #sysMemberRegisterConfirm #sysMain .sysFormField, #sysFormConfirm #sysMain .sysFormField { padding: 5px 5px 5px 10px; line-height: 1.5; } .sysItemSearchForm > div.sysItemSearchFormWord, .sysItemSearchForm > div { width: 100%; } .s-search input[type="search"] { width: 100% !important; margin: 0 auto 5px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px } .s-search .sysItemSearchAndOr { text-align: left; vertical-align: middle; } .s-search .sysItemSearchAndOr label { padding-right: 5px; text-align: left; font-size: 15px; } .s-search .sysItemSearchAndOr input[type="radio"] { width: 16px; height: 16px; } .s-search .sysItemSearchAndOr input[type="radio"]:checked { background-color: #00afe5; } .s-search .sysItemSearchFormCategory { width: 100%; text-align: left; } .s-search .sysItemSearchFormCategory select { width: 100%; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 5px; padding: 5px; } .sysSearchButton { width: 100%; margin: 10px auto 0; background-color: #00afe5; border: 1px solid #00afe5; border-radius: 5px } .sysSearchButton:hover { color: #00afe5; background-color: #fff; } .sysButton { width: auto; margin: 0 0 0 10px; padding: 5px 15px; font-size: 14px; color: #fff; background-color: #00afe5; } #sysMypageReminder #sysMain input.sysButton, #sysMemberRegisterIndex #sysMain input.sysButton, #sysMemberRegisterConfirm #sysMain input.sysBackButton, #sysFormIndex #sysMain input.sysButton, #sysMypageLogin #sysMain input.sysButton, .sysMypage #sysMain input.sysButton, #sysMypageWithdrawalConfirm.sysMypage #sysMain input.sysButton, #sysFormConfirm #sysMain button.sysButton { display: block; width: 120px; height: 38px; margin: 0 auto; text-align: center; font-size: 14px; color: #fff; background: -webkit-gradient(linear, left top, left bottom, from(#b3b3b3), to(#b3b3b3)); background-color: #b3b3b3; border: 1px solid #b3b3b3; border-radius: 5px; } #sysMypageWithdrawalConfirm.sysMypage #sysMain input.sysButton { width: 150px; margin: 30px auto 0; } #sysFormConfirm #sysMain button.sysButton { margin-top: 30px; } #sysMypageLogin #sysMain input.sysButton { width: 300px; height: 38px; margin-top: 30px; font-size: 14px; color: #00afe5; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)); background-color: #fff; border: 1px solid #00afe5; border-radius: 5px; } #sysMypageReminder #sysMain input.sysNextSubmit, #sysMemberRegisterIndex #sysMain input.sysNextSubmit, #sysMemberRegisterConfirm #sysMain input.sysNextSubmit, #sysFormIndex #sysMain input.sysNextSubmit, .sysMypage #sysMain input.sysNextSubmit, #sysFormConfirm #sysMain input.sysNextSubmit, #sysMypageLogin #sysMain input.sysLoginButton { max-width: 300px; height: 38px; margin-top: 30px; font-size: 14px; color: #fff; background: -webkit-gradient(linear, left top, left bottom, from(#ffa14a), to(#ffa14a)); background-color: #ffa14a; border: 1px solid #ffa14a; border-radius: 5px; } #sysFormConfirm #sysMain input.sysNextSubmit { margin-top: 10px; } #sysMypageLogin #sysMain input.sysLoginButton { margin-bottom: 20px; padding: 0; } #sysMypageIndex.sysMypage #sysMain .sysMypageNav, #sysMypageAshiato.sysMypage #sysMain .sysMypageNav { padding-top: 60px; } #sysMypageIndex.sysMypage #sysMain .sysMypageNav input.sysButton, #sysMypageAshiato.sysMypage #sysMain .sysMypageNav input.sysButton { width: 98% !important; margin-bottom: 20px; height: 40px; line-height: 30px; background: -webkit-gradient(linear, left top, left bottom, from(#00afe5), to(#00afe5)); background-color: #00afe5; border: 1px solid #00afe5; } #sysMypageIndex.sysMypage #sysMain .sysMypageNav input.sysButton:hover, #sysMypageAshiato.sysMypage #sysMain .sysMypageNav input.sysButton:hover { background: -webkit-gradient(linear, left top, left bottom, from(#ccc), to(#ccc)); background-color: #ccc; border: 1px solid #ccc; } #sysMypageIndex.sysMypage #sysMain .sysMypageNav form:nth-child(5), #sysMypageAshiato.sysMypage #sysMain .sysMypageNav form:nth-child(5) { display: none; } .sysMemberRegister #sysMain .sysFormItem.sysFax , .sysMemberRegister #sysMain .sysFormItem.sysGender, .sysMemberRegister #sysMain .sysFormItem.sysBirthday, .sysMemberRegister #sysMain .sysAcceptMailmagazine, .sysMypage #sysMain .sysFormItem.sysFax , .sysMypage #sysMain .sysFormItem.sysGender, .sysMypage #sysMain .sysFormItem.sysBirthday, .sysMypage #sysMain .sysAcceptMailmagazine { display: none; } #sysMemberRegisterIndex .sysErrorFormField { margin-top: 2px; padding: 1px; } /* リファレンス動画 サンプル */ #reference.wrap p, #reference.wrap li { margin: 0; padding: 0; line-height: 1.8; } #reference.wrap { position: relative; width: 100%; min-height: 100%; margin: 0 auto; line-height: 1.0; text-align: left; font-size: 16px; background: #f9f9f9; } #reference.wrap header { width: 100%; margin: 0 auto; background-color: #fff; border-top: 7px solid #016BB5; border-bottom: 1px solid #f2f2f2; } #reference.wrap #headerInner { max-width: 960px; width: 100%; margin: 0 auto; padding: 22px 10px; } #reference.wrap #logo { overflow: hidden; vertical-align: text-bottom; position: relative; margin: 0; } #reference.wrap #logo a { text-decoration: none; -webkit-transition: 200ms all ease; transition: 200ms all ease; display: inline-block; font-size: 0; float: left; } #reference.wrap #logo a:hover { opacity: .7; } #reference.wrap #logo img.sp { display: none; } #reference.wrap #logo span { padding-left: 16px; font-size: 20px; letter-spacing: 0.05em; } #reference.wrap #logo span.sub-ttl { position: absolute; right: 0; bottom: 0; color: #016bb5; } #reference.wrap #container { width: 100%; margin: 0 auto; padding: 20px 15px 130px; } #reference.wrap .pagePath { width: 100%; background-color: #F9F9F9; } #reference.wrap .pagePath ul { width: 100%; margin: 0 auto 20px; padding: 10px; display: inline-block; text-align: left; } #reference.wrap .pagePath ul li { padding-right: 10px; padding-left: 13px; font-size: 14px; float: left; background: url(/img/reference/arrow_right1.jpg) no-repeat left center; } #reference.wrap .pagePath ul li:first-child { padding-left: 0; background: none; } #reference.wrap .pagePath p span { padding-right: 10px; padding-left: 13px; font-size: 14px; background: url(../img/reference/arrow_left1.jpg) no-repeat left center; } #reference.wrap #contents { width: 100%; margin: 0 auto; background-color: #f9f9f9; } #reference.wrap #mainTtl { margin-bottom: 30px; line-height: 1.3; font-weight: bold; font-size: 36px; } #reference.wrap .officeMoral #mainTtl { color: #5976ba; } #reference.wrap .activationMethod #mainTtl { color: #F6AD30; } #reference.wrap .subTtl { font-weight: normal; font-size: 16px; letter-spacing: 0.05em; border-bottom: 1px solid #f2f2f2; } #reference.wrap .subTtl span { position: relative; display: inline-block; margin-right: 25px; padding: 8px 20px 6px 24px; font-size: 20px; color: #fff; } #reference.wrap .officeMoral .subTtl span { background-color: #5976ba; } #reference.wrap .activationMethod .subTtl span { background-color: #f6ad30; } #reference.wrap .subTtl span:before { position: absolute; top: 0; left: 0; content: ''; width: 0; border-width: 20px 20px 0 0; border-style: solid; } #reference.wrap .officeMoral .subTtl span:before { border-color: #f9f9f9 #5976ba #5976ba #5976ba; } #reference.wrap .activationMethod .subTtl span:before { border-color: #f9f9f9 #f6ad30 #f6ad30 #f6ad30; } #reference.wrap .subTtl2 { margin-bottom: 20px; padding: 0 0 0 15px; line-height: 1.8; font-weight: normal; font-size: 17px; letter-spacing: 0.05em; background: url(/img/reference/reference_icon_square.jpg) no-repeat left center; background-size: 5px 5px; position: relative; vertical-align: middle; -webkit-transform: perspective(1px) translateZ(0); transform: perspective(1px) translateZ(0); } #reference.wrap .officeMoral .subTtl2 { border-bottom: 1px solid #5976ba; } #reference.wrap .activationMethod .subTtl2 { border-bottom: 1px solid #f6ad30; cursor: pointer; } #reference.wrap .activationMethod .subTtl2 { position: relative; } #reference.wrap .activationMethod .subTtl2:after { position: absolute; top: 50%; right: 5px; -webkit-transform: translateY(-50%); transform: translateY(-50%); content: ''; width: 8px; height: 12px; background: url(/img/reference/reference_icon_arrow_right.png) no-repeat right center; background-size: 8px 12px; } #reference.wrap .subTtl2:before { content: ""; padding-right: 0; } #reference.wrap .subTtl2 span { margin-right: 20px; color: #333; } #reference.wrap .subTtl2 a { text-decoration: none; display: block; color: #0369B4; } #reference.wrap .list { margin-bottom: 32px; padding: 25px 20px 15px; background-color: #fff; } #reference.wrap .list ul li { margin-bottom: 10px; } #reference.wrap .list ul li:last-child { margin-bottom: 0; } #reference.wrap .list ul.stepList { padding-top: 2px; padding-bottom: 10px; } #reference.wrap .list span.link { display: block; margin-bottom: 20px; margin-left: 10px; padding: 0 0 0 15px; line-height: 1.3; font-size: 14px; background: url(/img/reference/reference_icon_square.jpg) no-repeat left center; background-size: 5px 5px; } #reference.wrap .list span.link a { display: inline-block; padding-right: 1px; padding-bottom: 1px; text-decoration: none; } #reference.wrap .officeMoral .list span.link a { color: #0369b4; border-bottom: 1px solid #0369b4; } #reference.wrap .list .child { display: none; } #reference.wrap footer { width: 100%; margin: 0 auto; position: absolute; bottom: 0; } #reference.wrap #pageTop { position: absolute; bottom: 65px; right: 20px; z-index: 999; line-height: 0; } #reference.wrap #pageTop img { width: 30px; height: auto; } #reference.wrap #footerInner { width: 100%; margin: 0 auto; background-color: #016BB5; } #reference.wrap #footerContents { max-width: 960px; width: 100%; margin: 0 auto; padding: 18px 15px; color: #fff; display: -ms-flex; display: -o-flex; display: -moz-flex; display: -webkit-flex; display: flex; -ms-flex-align: center; -webkit-box-align: center; -webkit-align-items: center; align-items: center; } #reference.wrap #siteLink { width: 50%; } #reference.wrap #siteLink span { padding-right: 20px; background: url(/img/reference/reference_icon_external_link.png) no-repeat right center; background-size: 15px 15px; } #reference.wrap #siteLink span a { color: #fff; text-decoration: none; } #reference.wrap #copyright { width: 50%; text-align: right; font-size: 14px; } .bold { font-weight: bold; } .font-red { color: #ff0000; } .indent { margin: 0; padding-left:1em; text-indent:-1em } span.indent, strong.indent { display:inline-block; } .block { display: block; } .inline-block { display: inline-block; } .inline { display: inline; } .txt-l { text-align: left; } .txt-c { text-align: center; } .txt-r { text-align: right; } dl.dl-style dt { margin-bottom: 5px; font-weight: bold; } dl.dl-style dd { margin-bottom: 15px; } ul.list-none li { list-style-type: none; margin-bottom: 5px; margin-left: 1em; text-indent: -1em; } ul.list-indent li, ol.list-indent li { list-style-type: none; margin-bottom: 5px; margin-left: 1em; text-indent: -1em; } ul.list-dot li { margin-bottom: 5px; margin-left: 1em; list-style-type: disc; } ol.list-number li { margin-bottom: 5px; margin-left: 1em; list-style-type: decimal; } span.link, span.link2 { display: inline-block; } span.link a, span.link2 a { display: inline-block; padding-left: 14px; background: url(../img/product-details/icon_arrow_right.png) no-repeat left 4px top 6px; } span.link2 a { padding-left: 10px; } span.link-out a { padding-right: 20px; background: url(../img/product-details/icon_links.png) no-repeat right 2px top 4px; background-size: 14px 14px; } .box { padding: 15px; border: 1px solid #ccc; } /* 検索結果 */ #sysItemCategory .sysItemCategoryPankuzu { border-bottom : none; } .sysItemCategoryCtl { margin: 20px 0 0; padding: 5px 0; font-size: 15px; border-top : 1px dotted #b3e0f5; border-bottom : 1px dotted #b3e0f5; } .sysItemCategoryCtl a { padding: 4px 8px; font-size: 14px; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 5px; } .sysItemCategoryCtl .sysCurrent { font-weight: normal; } .sysItemCategoryCtl .sysCurrent a { color: #fff; background: #00afe5; border: 1px solid #00afe5; } .sysItemListDisp { padding: 15px 0; font-size: 15px; } .sysItemListViewType input[type="radio"] { width: 16px; height: 16px; margin-left: 5px; border: 1px solid rgb(204,204,204); } .sysItemListViewType input[type="radio"]:checked { background: #00afe5; } .sysItemList ul.sysList li { padding: 30px 20px; border-top: 1px solid #333; overflow: hidden; } .sysItemList ul.sysList li:last-child { border-bottom: 1px solid #333; } .sysItemList ul.sysList li .sysThumbnailImage { margin-right: 30px; } .sysMypage .sysItemList ul.sysList li div:first-child a { margin-bottom: 0; font-size: medium; } .sysItemList ul.sysList li .sysItemName { margin-bottom: 20px; font-size: 26px; } .sysItemList ul.sysList li .sysItemName a { text-decoration: none; } .sysMypage .sysItemList ul.sysList li div a { display: block; margin-bottom: 20px; font-size: 26px; text-decoration: none; } .sysItemList ul.sysList li .sysItemName a:hover { color: #00afe5; } .sysDescriptionPc { font-size: 15px; } .sysRetailPrice { text-align: right; margin-bottom: 20px; padding-top: 20px; padding-bottom: 0; border-bottom: none; } .sysCartButton, .sysMypage #sysMain input.sysCartButton { width: 310px; padding: 10px; background: #bf0000 url(../img/product-details/icon_cart.png) no-repeat left 70px center; border: 1px solid #bf0000; float: right; } .sysMypage #sysMain input.sysCartButton { margin-top: 30px; } .sysMypage #sysMain .sysThumbnail input.sysCartButton { width: 100%; padding: 10px 10px 10px 20px; background-position: left 20px center; float: none; } .sysCartButton:hover, .sysMypage #sysMain input.sysCartButton:hover { background: #d45252 url(../img/product-details/icon_cart.png) no-repeat left 70px center; } .sysMypage #sysMain .sysThumbnail input.sysCartButton:hover { background-position: left 20px center; } .sysItemList ul.sysThumbnail li { padding: 15px 12px 30px; font-size: 15px; } .sysItemList ul.sysThumbnail li .sysThumbnailImage { margin-bottom: 15px; } .sysItemList ul.sysThumbnail li .sysItemName { margin-bottom: 15px; } .sysItemList ul.sysThumbnail li .sysItemName a { font-size: large; text-decoration: none; } .sysItemList ul.sysThumbnail li .sysRetailPrice { font-size: 16px; } .sysItemList ul.sysThumbnail li .sysCartButton { padding-left: 10px; background-position: left 20px center; } .sysPagination { padding-top: 30px; padding-bottom: 60px; } .sysPagination ul li { width: 10%; } .sysPagination a { width: 100%; line-height: 40px; font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: bold; font-size: 15px; color: #3399cc; text-decoration: none; border: 1px solid #ccc; border-radius: 5px; } .sysPagination a:hover { color: #fff; background-color: #00afe5; border: 1px solid #00afe5; } .sysPagination > ul > li > a { text-decoration: none !important; } .sysPagination a.sysCurrent { color: #fff; background-color: #00afe5; border: 1px solid #00afe5; } .sysItemSearchForm .sysItemSearchFormInput { margin-bottom: 30px; } .sysItemSearchFormWord input[type="search"] { padding-left: 5px; background-color: #fff; border: 1px solid #ccc; border-radius: 3px; } .sysItemSearchForm div.sysItemSearchAndOr { padding: 10px 5px 15px; text-align: right; font-size: 15px; } #sysAside .sysItemSearchForm div.sysItemSearchAndOr { padding: 0 2px 15px; text-align: left; } .sysItemSearchForm div.sysItemSearchAndOr input[type="radio"] { width: 16px; height: 16px; margin-right: 5px; margin-left: 5px; border: 1px solid rgb(204,204,204); } #sysAside .sysItemSearchForm div.sysItemSearchAndOr input[type="radio"] { margin-right: 3px; } .sysItemSearchForm div.sysItemSearchAndOr input[type="radio"]:checked { background-color: #00afe5; } .sysItemSearchForm select { background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 5px; } .sysItemSearchForm .sysItemSearchFormCategory, .sysItemSearchForm .sysItemSearchFormSort { margin-bottom: 10px; } .sysItemSearchForm .sysItemSearchFormCategory select { margin-left: 5px; } #sysAside .sysItemSearchForm .sysItemSearchFormCategory select { margin-left: 0; } .sysItemSearchForm .sysItemSearchFormInput .sysSearchButton { width: 300px; } /* カート */ body.sysCart{ font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; } .sysCart #sysMain a { text-decoration: none; } .sysCart h1, .sysCart h2, .sysCart h1 { margin: 0; line-height: 1.5; } .sysCart h2.sysCartTitle { margin-bottom: 30px; padding: 5px; font-size: 26px; color: #000; background-color: transparent; border-bottom: #000 1px solid; } .sysCart #sysMain .sysForm .sysFormItem label { font-size: 15px; } .sysCartItemAreaMessage { font-size: 14px; } .sysBox { margin-bottom: 0; font-size: 16px; background-color: transparent; border: none; -moz-box-shadow: 0 0 0 #999999; -webkit-box-shadow: 0 0 0 #999999; box-shadow: 0 0 0 #999999; } #sysBasket.sysCart #sysMain input.sysBackButton[type="submit"] { margin: 60px auto 0; background-color: #b3b3b3; border: 1px solid #b3b3b3; } #sysBasket.sysCart #sysMain input.sysBackButton[type="submit"]:hover { background-color: #ccc; } #sysBasket.sysCart .sysBox a { margin-bottom: 20px; } #sysBasket.sysCart .sysProduct { width: 66%; } #sysBasket.sysCart #sysMain .sysProduct .sysItemName { margin-bottom: 20px; line-height: 1.3; font-size: 26px; } #sysBasket.sysCart #sysMain .sysProduct .sysItemName a { margin-bottom: 0; } #sysBasket.sysCart #sysMain .sysProduct .sysItemRetailPrice { text-align: right; } #sysBasket.sysCart .sysBox hr { margin: 0 0 20px; padding: 20px 0 0; border-top: none; border-bottom: 1px solid #ccc; } .sysCart #sysMain .sysFormItem.sysSubmit { margin: 20px 0 60px; } .sysCart #sysMain input[type="text"], .sysCart #sysMain input[type="tel"] { margin: 5px auto; padding: 5px; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)); background-color: #fff; border: 1px solid #ccc; border-radius: 3px; } #sysBasket.sysCart #sysMain .sysNextSubmit, #sysPayment.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit, #sysConfirm.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit, .sysCart #sysMain .sysFormItem.sysSubmit input[type="submit"] { width: 320px; height: 40px; padding: 0; font-size: 16px; background: #ffa14a; border: 1px solid #ffa14a; } .sysCart #sysMain .sysFormItem.sysSubmit input[type="submit"] { padding: 10px; } .sysCart #sysMain .sysNextSubmitArea { margin: 50px auto 30px; } #sysConfirm.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit { margin: 30px auto; } .sysCart #sysMain select { background: #f7f7f7; border: 1px solid #e6e6e6; } .sysCart #sysMain button, .sysCart #sysMain button, .sysCart #sysMain .sysDeleteArea input[type="submit"], #sysPayment.sysCart #sysMain .sysBackSubmitArea .sysButton.sysBackSubmitArea { background: #333; border: 1px solid #333; } .sysCart #sysMain .sysNumArea, .sysCart #sysMain .sysDeleteArea { margin: 10px 0; } #sysPayment.sysCart #sysMain .sysBackSubmitArea { text-align: center; } #sysPayment.sysCart #sysMain .sysBackSubmitArea .sysButton.sysBackSubmitArea, #sysConfirm.sysCart .sysBackSubmitArea .sysButton.sysBackSubmitAre, .sysCart #sysMain .sysFormItem.sysMemberPassword .sysFormItem.sysSubmit input[type="submit"] { background-color: #b3b3b3; border: 1px solid #b3b3b3; } .sysCart .sysSelectPaymentArea, .sysCart .sysSelectDeliveryArea { margin-bottom: 30px; } #sysConfirm.sysCart .sysBackSubmitArea .sysButton.sysBackSubmitAre { margin: 30px auto; } #sysConfirm.sysCart #sysMain .sysBackSubmitArea, #sysRegi.sysCart #sysMain .sysBackSubmitArea, #sysDestination.sysCart #sysMain .sysBackSubmitArea { text-align: center; } #sysConfirm.sysCart #sysMain .sysBackSubmitArea input[type="submit"] { margin: 0 auto 60px; background-color: #b3b3b3; border: 1px solid #b3b3b3; } #sysRegi.sysCart #sysMain .sysBackSubmitArea input[type="submit"], .sysCart #sysMain input[type="submit"] { margin: 0 auto; background-color: #b3b3b3; border: 1px solid #b3b3b3; } .sysCart input[type="radio"] { width: 16px; height: 16px; margin-right: 5px; border: 1px solid rgb(204,204,204); } .sysCart input[type="radio"]:checked { background-color: #00afe5; } .sysCart .sysSelectPayment.sysErrorFormField input[type="radio"] { border: 1px solid rgb(51,51,51); } .sysCart input[type="checkbox"] { width: 14px; height: 14px; margin-right: 3px; border: 1px solid rgb(204,204,204); } .sysCart .sysErrorMessage { padding: 0 0 10px; font-size: 15px; } .sysErrorFormField { padding: 15px; } .sysCart .sysOrder ul.nav li { padding: 15px 10px; } .sysCart .sysConfirmInfo { font-size: 15px; } .sysCart #sysMain .sysConfirmButton input[type="submit"], #sysRegi.sysCart #sysMain .sysNextSubmitArea .sysNextSubmit { width: 300px; height: 40px; font-size: 16px; background: #00afe5; border: 1px solid #00afe5; } .sysCartNote { font-size: 14px; } .sysAcceptDomainArea { padding-bottom: 60px; font-size: 14px; } .sysCart #sysMain input[type="email"], .sysCart #sysMain input[type="password"] { padding: 5px; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)); background-color: #fff; border: 1px solid #ccc; border-radius: 3px; } #sysRegi.sysCart #sysMain .sysNextSubmitArea { margin-bottom: 60px; } #sysRegi.sysCart .sysBox p { margin: 0 auto 10px; font-size: 15px; } #sysDestination.sysCart .sysSelectAddress { margin: 10px 0 30px; padding: 0 10px; border: none; } #sysBillingAddress.sysCart .sysFormItem.sysName { padding-top: 0; } #sysBillingAddress.sysCart .sysZipcode .sysFormField { width: 100%; } #sysBillingAddress.sysCart #sysMain .sysZipcode .sysFormField input[type="text"] { width: 200px; } #sysBillingAddress.sysCart #sysMain .sysZipcode .sysFormField button { width: auto; height: auto; margin-left: 10px; padding: 5px 15px; line-height: 1.2; font-size: 14px; color: #fff; background-color: #00afe5; border: 1px solid #00afe5; } #sysBillingAddress.sysCart #sysMain .sysFormItem.sysGender, #sysBillingAddress.sysCart #sysMain .sysFormItem.sysAcceptMailmagazine { display: none; } #sysBillingAddress.sysCart #sysMain .sysNextSubmit, #sysMypageReminder #sysMain input[type="submit"] { width: 300px; height: 38px; margin: 30px auto; padding: 5px; font-size: 14px; background: #ffa14a; border: 1px solid #ffa14a; } #sysBillingAddress.sysCart #sysMain .sysBackSubmitArea { text-align: center; } .sysMemberAgreementFormLabel { padding: 0 10px; font-weight: bold; font-size: 18px; border-left: 3px solid #b3e0f5; } .sysMemberAgreement { margin-top: 15px; margin-bottom: 10px; padding: 15px; border: 1px solid #ccc; } #sysThanks.sysCart .sysFormItem.sysMemberPassword .sysFormField { padding-bottom: 10px; } #sysThanks.sysCart #sysMain .sysFormItem.sysSubmit { margin: 20px 0 0; } #sysThanks.sysCart .sysErrorMessage { padding: 0; } #sysThanks.sysCart #sysMain .sysButton.sysBack { width: 200px; margin: 50px auto 0; padding: 10px; text-align: center; font-family: YuGothic, "Yu Gothic", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴシック ProN", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴシック Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: bold; font-size: 15px; color: #fff; background: -webkit-gradient(linear, left top, left bottom, from(#b3b3b3), to(#b3b3b3)); background-color: #b3b3b3; border: 1px solid #b3b3b3; } .sysMypage #sysMain h3.sysMypageMinorHeadLine, .sysMypage #sysMain h3.SysMypageMinorHeadLine { margin-bottom: 20px; padding: 0 10px; font-weight: bold; font-size: 18px; letter-spacing: 0.04em; border-left: 3px solid #b3e0f5; } #sysMypageReminder.sysMypage .sysErrorMessage { padding: 0 0 0.3em; } #sysMemberRegisterIndex #sysMain .sysMemberAgreement { margin-top: 20px; } #sysMypageLogin .sysFormItem.sysMailaddress { padding-bottom: 20px; } .sysOrderList { padding: 20px 0 10px; max-height: initial; max-height: auto; border: none; overflow-y: visible; } .sysOrderList li { border-bottom: 1px dotted rgb(51,51,51); margin-bottom: 15px; padding-bottom: 15px; } .sysOrderList li a { color: #3399cc; text-decoration: none; } .sysOrderList li a:hover { color: #333; } #sysBillingAddress.sysCart #sysMain input[type="submit"], #sysPayment.sysCart #sysMain input[type="submit"] { display: block; width: 300px; height: 38px; margin: 30px auto; padding: 3px 5px; font-size: 15px; background: #ffa14a; border: 1px solid #ffa14a; } #sysPayment.sysCart #sysMain .sysBackSubmitArea input[type="submit"] { width: 200px; } #sysBillingAddress.sysCart #sysMain .sysBackSubmitArea input[type="submit"] { width: 200px; margin: auto; padding: 10px; color: #fff; background: -webkit-gradient(linear, left top, left bottom, from(#b3b3b3), to(#b3b3b3)); background-color: #b3b3b3; border: 1px solid #b3b3b3; } .sysSelectAddress { font-size: 15px; background-color: #fff; background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#fff)); } .sysSelectAddress div { padding: 0 1em 20px; } .sysSelectAddress .sysSubTitle { font-size: 18px; text-decoration: none; } #sysDestination.sysCart #sysMain input[type="submit"], #sysDestination.sysCart #sysMain button[type="submit"] { width: 300px; background: #ffa14a; border: 1px solid #ffa14a; } #sysDestination.sysCart #sysMain button[type="submit"] { margin: auto; } #sysDestination.sysCart #sysMain .sysBackSubmitArea input[type="submit"] { width: auto; background-color: #b3b3b3; border: 1px solid #b3b3b3; } .sysSelectAddress a { display: block; width: 300px; height: 38px; line-height: 36px; margin: auto; padding: 0 5px; text-align: center; font-size: 15px; color: #000; background: #f7f7f7; border: 1px solid #e6e6e6; border-radius: 0; } .sysSelectAddress .sysAccordion .sysSubTitle { font-size: 15px; color: #000; text-decoration: none; } .sysSelectAddress a:hover { background: #f7f7f7; } .sysAccordion:after { display: none; } #sysDestination.sysCart #sysMain .sysZipcode .sysFormField { width: 100%; } #sysDestination.sysCart #sysMain .sysZipcode .sysFormField button { width: auto; margin: 0 0 0 10px; padding: 5px 15px; font-size: 14px; background: #00afe5; border: 1px solid #00afe5; } /* 法人の皆様へ */ #for-corporations p.txt a { color: #00afe5; } .order-flow p { margin: auto; } .order-flow-box { padding: 15px; margin-bottom: 10px; border: #009900 1px solid; } .order-flow-txt { margin-bottom: 10px !important; text-align: center; font-weight: bold; color: #009900; } .order-flow-box a { color: #00afe5; } .order-flow-arrow { margin-bottom: 10px; text-align: center; font-size: 14px; color: #009900; } .order-flow-btn { text-align: center; } .order-flow-btn .btn-default { padding-right: 30px; color: #fff; border: 1px solid #00afe5; background: #00afe5 url(../img/product-details/icon_arrow_right_wt.png) no-repeat right 10px center; } .order-flow-btn .btn-default:hover { color: #00afe5; background: #fff url(../img/product-details/icon_arrow_right.png) no-repeat right 10px center; } dl.help-dl { } dl.help-dl dt { margin-bottom: 10px; font-weight: bold; color: #0071b7; } dl.help-dl dd { margin-bottom: 20px; } /* プライバシーポリシー・特定商取引に基く表示 */ .lower-cont { padding: 10px; } .lower-cont p.txt a:hover { text-decoration: none; } #sysMain .sysContent .lower-cont .sysHeadline { position: relative; margin-bottom: 40px; padding: 5px; font-size: 26px; color: #000; border-bottom: 1px solid #000; background-color: transparent; } #sysMain .sysContent .lower-cont .sysHeadline:after { content: ""; display: block; position: absolute; bottom: -7px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); width: 36px; height: 6px; background: url(../img/product-details/ttl_deco.png) no-repeat center center; } #sysMain .sysContent .lower-cont h3.ttl, .lower-cont .ttl { margin-bottom: 30px; padding: 0 10px; line-height: 1.2; font-size: 18px; border-bottom: none; border-left: 3px solid #b3e0f5; } #haiso.lower-cont .ttl { margin-bottom: 20px; } #sysMain .sysContent #privacypolicy h3.ttl:before, #sysMain .sysContent #tokusho h3.ttl:before, #sysMain .lower-cont .ttl:before { content: ""; padding-right: 0; } .sub-ttl { font-weight: bold; font-size: 18px; margin-bottom: 15px; } .sub-ttl2 { font-weight: bold; margin-bottom: 10px; } .contents { margin-bottom: 50px; } #privacypolicy .contents { margin-bottom: 60px; } .sec-cont { margin-bottom: 40px; } dl.tokusho-dl { margin-bottom: 40px; } dl.tokusho-dl dt { margin-bottom: 10px; font-weight: bold; } dl.tokusho-dl dd { margin-bottom: 20px; } .privacy-content { margin-bottom: 40px; } dl.privacy-dl dt { margin-bottom: 5px; padding-left: 1.2em; text-indent: -1.2em; } dl.privacy-dl dd { margin-bottom: 30px; padding-left: 1.2em; } table.privacy-table, table.ness-table { border-collapse: collapse; width: 100%; margin: 15px auto 20px auto; text-align: left; border-top: 1px solid #ccc; border-left: 1px solid #ccc; } table.privacy-table th, table.ness-table th { padding: 8px; font-weight: normal; color: #333; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background-color: #f0f0f0; } table.privacy-table td, table.ness-table td { padding: 8px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; } table.ness-table th, table.ness-table td { text-align: center; } table.ness-table td { background-color: #fff; } #privacypolicy ul.list-dot.mb li { margin-bottom: 15px; } #privacypolicy .privacy-dl dd ol { padding-left: 1.4em; text-indent: -1.4em; } #privacypolicy .privacy-dl dd ol li { margin-bottom: 10px; } .privacy-pdf { display: inline-block; padding-left: 20px; background: url(../img/product-details/ico_pdf.png) no-repeat left center; } .privacy-pdf a:hover { text-decoration: none; } .privacy-box { display: inline-block; padding: 10px 18px; border: 1px solid #CCC; } #p-mark { padding: 0 20px; display: -ms-flex; display: -o-flex; display: -moz-flex; display: -webkit-flex; display: flex; -ms-flex-align: end; -webkit-align-items: end; align-items: end; } #p-mark span { display: inline-block; } #p-mark .p-mark-icon { width: 84px; text-align: right; } #p-mark .p-mark-icon a { display: inline-block; padding-right: 13px; vertical-align: text-bottom; background: url(../img/product-details/icon_links.png) no-repeat right 56px; background-size: 14px 14px; } #p-mark .p-mark-txt { margin-left: 1em; padding-bottom: 6px; padding-left: 1em; text-indent: -1em; font-size: 13px; color: #666; } #ness-demo #sysMain, #web-test #sysMain { margin: 0 auto; padding: 0; } #ness-demo #sysAside, #ness-demo #sysFooter, #web-test #sysAside, #web-test #sysFooter { margin: 0; padding: 0; line-height: 0; } #ness #sysWrap, #ness-demo #sysWrap, #web-test #sysWrap { padding: 0; } .free-page-wrap { max-width: 680px; margin: 0 auto; padding: 0 20px; } .free-page-wrap header { margin: 0 auto 10px; padding: 20px 0; } .free-page-wrap footer { padding: 10px; text-align: center; font-size: small; color: #fff; background-color: #333; } .free-page-wrap footer p { margin: 0 auto; } .free-page-cont { margin: 0 auto 60px; } .free-page-wrap #main-bnr { margin: 0 auto 40px; text-align: center; } .free-page-wrap #main-bnr img { width: 100%; height: auto; } .free-page-wrap .txt a { color: #00afe5; } /* NESS */ .ness-demo .sysContent { padding: 0; } .ness-wrap { max-width: 680px; margin: 0 auto; padding: 0 20px; } .ness-header { margin: 0 auto 10px; padding: 20px 0; } .ness-ttl { width: 100%; margin-bottom: 30px; padding: 3px; background: #FDD876; border-radius: 16px; } .ness-ttl span { display: block; padding: 7px 17px 6px; font-weight: bold; font-size: 18px; color: #fff; border: solid 1px #fff; background-color: #F3A352; border-radius: 16px; } .ness-main-bnr { margin-bottom: 30px; text-align: center; } .btn-img { margin-bottom: 20px; text-align: center; } #sysMain .sysContent .ness-demo-cont h3.icon-ttl { position: relative; margin-bottom: 10px; padding-left: 16px; border-bottom: none; } #sysMain .sysContent .ness-demo-cont h3.icon-ttl:before { content: "●"; display: inline-block; position: absolute; top: 50%; left: 0; -webkit-transform: translateY(-52%); transform: translateY(-52%); font-size: 12px; color: #f8a01a; } #ness-demo .txt a { color: #00afe5; } .ness-demo-calculation { margin-bottom: 25px; padding: 0 15px; } .ness-demo-calculation .font-style1 { display: table-cell; padding: 2px 8px; vertical-align: middle; letter-spacing: -0.01em; color: #555; border: 1px solid #999; } .ness-demo-calculation .font-style2 { display: table-cell; padding-right: 5px; padding-left: 5px; vertical-align: middle; font-weight: bold; font-size: x-large; color: #333; } .ness-demo-calculation .font-style3 { display: table-cell; vertical-align: middle; font-weight: bold; font-size: large; color: #ff9900; } .ness-demo-calculation .font-style4 { display: table-cell; padding-left: 5px; vertical-align: bottom; font-size: small; } .ness-demo-list { margin-bottom: 30px; display: flex; flex-wrap: wrap; } .ness-demo-list-cont { width: 33%; margin-bottom: 30px; padding: 0 15px; text-align: center; display: flex; flex-wrap: wrap; } .ness-demo-list-img img { width: 100%; height: auto; } .ness-demo-list-txt { margin-bottom: 10px; line-height: 1.2; font-weight: bold; font-size: small; } table.ness-demo-list-table { width: 100%; margin: auto auto 0; border-collapse: collapse; border: 1px solid #FF9900; } table.ness-demo-list-table th { padding: 2px 5px; text-align: center; font-weight: bold; font-size: 13px; color: #FFFFFF; border: 1px solid #FF9900; background-color: #FF9900; } table.ness-demo-list-table td { padding: 3px 5px 3px 0; line-height: 1.4; font-size: 13px; border: 1px solid #FF9900; background-color: #FFFFFF; } table.ness-demo-list-table td .txt-style1 { display: block; text-align: left; color: #ff0000; } table.ness-demo-list-table td .txt-style2 { display: block; text-align: right; font-weight: bold; font-size: 18px; color: #ff0000; } table.ness-demo-list-table td .txt-style3 { display: block; text-align: left; } table.ness-demo-list-table td .txt-style4 { display: block; text-align: right; font-weight: bold; font-size: 18px; color: #333; } table.ness-demo-list-table td .txt-style2 span, table.ness-demo-list-table td .txt-style4 span { font-size: 12px; } table.ness-demo-version-table { width: 100%; margin: 0 auto 10px; border-collapse: collapse; border: 1px solid #8E8D93; } table.ness-demo-version-table th { padding: 10px 5px; color: #fff; background-color: #666; border: 1px solid #8E8D93; } table.ness-demo-version-table thead th { text-align: center; background-color: #787878; } table.ness-demo-version-table td { padding: 10px 5px; line-height: 1.4; text-align: center; border: 1px solid #8E8D93; } table.ness-demo-version-table td span { font-size: 13px; } .catch-txt { font-weight: bold; font-size: 20px; } .ness-sub-ttl { margin-bottom: 25px; padding-bottom: 5px; font-weight: bold; font-size: 18px; color: #0071B7; border-bottom: 2px solid #00afe5; } .ness-dl { } .ness-dl dt { margin-bottom: 16px; overflow: hidden; } .ness-dl dt img { float: left; } .ness-dl dt span { display: block; margin-bottom: 6px; margin-left: 42px; padding: 2px 2px 6px 2px; font-weight: bold; font-size: 18px; color: #F05A7D; border-bottom: 2px dashed #00afe5; } .ness-dl dd { margin-bottom: 30px; padding-left: 42px; } .ness-cont { display: block; margin-bottom: 60px; } .ness-demo-cont { margin-bottom: 50px; padding: 0 20px; } .ness-demo-box { margin-bottom: 30px; text-align: center; background-color: #E6F5FC; } .ness-demo-box-cont { padding: 20px; } .ness-demo-ttl { padding: 8px 10px; font-weight: bold; font-size: 18px; color: #fff; background-color: #F3A352; } .ness-box-cont { display: flex; flex-wrap: wrap; } .ness-box { width: 50%; margin-bottom: 30px; padding: 0 10px; display: flex; flex-wrap: wrap; -ms-flex-align: start; -webkit-box-align: start; align-items: flex-start; } .ness-box-ttl { display: bolck; width: 100%; height: 34px; margin: 0 0 12px; padding: 0 10px; line-height: 34px; font-weight: bold; color: #fff; background-color: #ff9f00; } .ness-box-txt { margin: 0 0 30px; padding: 0; } .ness-box-txt p { margin: 0; padding: 0; } .ness-box-txt .indent { font-size: small; } .ness-box-img { margin-top: auto; } .ness-demo-box2 { margin-bottom: 20px; padding: 5px; border: 1px solid #ccc; } .ness-demo-box2-cont { padding: 10px; } .ness-wrap footer { padding: 10px; text-align: center; font-size: small; color: #fff; background-color: #333; } /* Webテスト */ .web-test .sysContent { padding: 0; } .web-test-cont { margin-bottom: 60px; padding: 0 10px; } .web-test-ttl { margin-bottom: 30px; padding: 3px; line-height: 1.2; background: #77d1ee; border-radius: 16px; } .web-test-ttl span { display: block; padding: 7px 17px 6px; font-weight: bold; font-size: 20px; color: #fff; border: solid 1px #fff; border-radius: 16px; background-color: #33c4eb; } .web-test-txt { margin-bottom: 30px; line-height: 1.5; font-weight: bold; font-size: 18px; color: #0071b7; } .web-test-list-ttl { margin-bottom: 10px; font-weight: bold; color: #0071b7; } .web-test-list { padding: 6px 18px 12px; background-color: #f7fbfe; } .web-test-list ul li { padding: 5px 2px; line-height: 1.5; font-weight: bold; border-bottom: 1px solid #a0d6f2; } .web-test-list ul li:before { content: "■"; padding-right: 2px; color: #86cfef; } .web-test-list ul li span { display: inline-block; } .web-test-list ul li span.head { width: 150px; color: #0071b7; } .web-test-list ul li span.txt { padding-left: 1.1em; color: #333; } .web-test-demo-inner { padding: 0 10px; } .web-test-demo-box { text-align: center; border: 1px solid #ccc; background-color: #f9f9fb; } .web-test-demo-ttl { padding: 8px 10px; font-weight: bold; font-size: 18px; color: #fff; background-color: #33c4eb; border-bottom: none !important; } .web-test-demo-ttl:before { display: none; } .web-test-demo-box-cont { padding: 25px 30px 20px; } table.web-test-table { width: 360px; margin: 0 auto 20px; border-collapse: collapse; border: 1px solid #8e8d93; } table.web-test-table th { width: 50%; padding: 6px; text-align: center; font-weight: normal; border: 1px solid #8e8d93; background-color: #edeef0; } table.web-test-table td { padding: 6px; text-align: center; border: 1px solid #8e8d93; background-color: #fff; } /* 基本情報 */ ul.detail-info-link { padding: 1em 0 0; } ul.detail-info-link li { list-style-type: none; display: inline-block; margin-bottom: 10px; padding-right: 1em; font-size: 15px; color: #3399cc; } ul.detail-info-link li a { text-decoration: none; color: #3399cc; } ul.detail-info-link a:hover { text-decoration: underline; } ul.detail-info-link li span.icon { padding-right: 2px; font-size: 12px; } .detail-info { padding: 2em 0; } .detail-info p { margin: auto; } .detail-info a { text-decoration: none; color: #3399cc; } .detail-info a:hover { text-decoration: underline; } .detail-info a:hover img { opacity: 0.80; } .detail-info-ttl { position: relative; margin-bottom: 20px; padding: 10px 20px 10px 30px; font-size: 16px; color: #000; letter-spacing: 0.04em; border: 1px solid #000; } .detail-info-ttl:before { content: "●"; display: inline-block; position: absolute; top: 50%; left: 11px; -webkit-transform: translateY(-52%); transform: translateY(-52%); font-size: 12px; } #detail-info1 .detail-info-ttl:before { color: #b3e0f5; } #detail-info2 .detail-info-ttl:before { color: #c5f4b5; } #detail-info3 .detail-info-ttl:before { color: #ffe1ac; } #detail-info4 .detail-info-ttl:before { color: #ffb5c1; } .detail-info-sub-ttl { margin-bottom: 10px; } .detail-info .ebook-trial-area { margin-bottom: 20px; display: -o-flex; display: -moz-flex; display: -webkit-flex; display: flex; flex-wrap: wrap; } .ebook-trial-area-ttl { margin-bottom: 10px; font-weight: normal; } .detail-info .ebook-area { width: 48%; margin-right: 2%; } .detail-info .ebook-area ul li { margin-bottom: 10px; } .detail-info .ebook-area ul li a { display: block; padding: 10px 10px 10px 45px; font-size: 14px; color: #fff; text-decoration: none; background: #2281c5 url(/img/product-details/icon_book_wt.png) no-repeat left 15px center; border-radius: 5px; } .detail-info .trial-area { width: 48%; margin-left: 2%; } .detail-info .trial-area p a { display: block; padding: 10px 10px 10px 45px; font-size: 14px; color: #fff; text-decoration: none; background: #00afe5 url(/img/product-details/icon_pdf.png) no-repeat left 15px center; border-radius: 5px; } p.btn-ebook { margin-bottom: 20px } p.download-txt, .download-txt { margin-bottom: 20px } p.download-btn { margin-bottom: 20px } ul.download-btn-list { margin-bottom: 25px } ul.download-btn-list li { margin-bottom: 10px; margin-left: 1em; list-style-type: disc; } ul.download-btn-list li span { display: inline-block; margin-bottom: 5px; } .pdf-area { padding: 15px; background-color: #ffffdf; } p.pdf-download { margin-bottom: 5px } p.pdf-download a { padding: 2px 0 2px 25px; background: url(../img/product-details/icon_pdf.png) no-repeat left center; } p.pdf-txt { margin-bottom: 5px } span.pdf-download { display: inline-block; } span.pdf-download a { display: inline-block; padding: 5px 0 5px 25px; background: url(../img/product-details/icon_pdf.png) no-repeat left center; } .text-info-area { min-width:200px; margin:0 30px 0 0; padding:10px 30px 10px 10px; display: inline-block; border:1px solid #CCC } .text-info-area ul { margin:0; padding:0 } .text-info-area ul li { margin:0; padding:0; list-style-type:none } .text-info-area ul li:before { margin:0; padding:0 2px 0 0; content:"●" } .nessset-area { padding-top: 25px; } p.nessset-txt { margin-bottom: 6px } /* 目次 */ .mokuji-title1 { margin:0 0 5px !important; padding:0 !important; font-weight:700; color:#138C5F; } .mokuji-title2 { margin:0 !important; padding:0 !important; font-weight:700; color:#138C5F !important; } .mokuji-title1-sub1 { margin:0 !important; padding:0 0 0 10px !important; color:#138C74; } .mokuji-title1-sub1-mb5 { margin:0 0 5px !important; padding:0 0 0 10px !important; color:#138C5F; } .mokuji-title1-sub2 { margin:0 !important; padding:0 0 0 20px !important; color:#138C5F; } .mokuji-title1-sub2-mb5 { margin:0 0 5px !important; padding:0 0 0 20px !important; color:#138C5F; } .mokuji-separate-title { margin:0 0 5px; padding:0; font-weight:700; font-size:120%; color:#DF4A06; } .mokuji-contents-mb0 { margin:0 !important; padding:0 0 0 20px !important; } .mokuji-contents-mb5 { margin:0 0 5px !important; padding:0 0 0 20px !important; } .mokuji-contents-mb10 { margin:0 0 10px !important; padding:0 0 0 20px !important; } .mokuji-contents-mb15 { margin:0 0 15px !important; padding:0 0 0 20px !important; } .mokuji-contents-mb20 { margin:0 0 20px !important; padding:0 0 0 20px !important; } .mokuji-contents-ul { margin:0 0 0 40px !important; padding:0 !important; } .mokuji-contents-ul li { margin:0; padding:0; list-style-type:disc; } .mokuji-contents2-mb0 { margin:0 !important; padding:0 0 0 30px !important; } .mokuji-contents2-mb5 { margin:0 0 5px !important; padding:0 0 0 30px !important; } .mokuji-contents2-mb10 { margin:0 0 10px !important; padding:0 0 0 30px !important; } .mokuji-contents2-mb15 { margin:0 0 15px !important; padding:0 0 0 30px !important; } .mokuji-contents2-mb20 { margin:0 0 20px !important; padding:0 0 0 30px !important; } .mokuji-contents3-mb0 { margin:0 !important; padding:0 0 0 10px !important; } .mokuji-contents3-mb5 { margin:0 0 5px !important; padding:0 0 0 10px !important; } .mokuji-contents3-mb10 { margin:0 0 10px !important; padding:0 0 0 10px !important; } .mokuji-contents3-mb15 { margin:0 0 15px !important; padding:0 0 0 10px !important; } .mokuji-contents3-mb20 { margin:0 0 20px !important; padding:0 0 0 10px !important; } .mokuji-contents4 { margin:0 !important; padding:0 0 0 70px !important; } .mokuji-text-mb5 { margin:0 0 5px !important; padding:0 0 0 10px !important; } .mokuji-text-mb5 span { color:#138C5F; } .mokuji-text-mb10 { margin:0 0 10px !important; padding:0 0 0 10px !important; } .mokuji-text-mb10 span { color:#138C5F; } .mokuji-text-mb20 { margin:0 0 20px !important; padding:0 0 0 10px !important; } .mokuji-text-mb20 span { color:#138C5F; } .mt0 {margin-top:0 !important;} .mb0 {margin-bottom:0 !important;} .mb2 {margin-bottom:2px !important;} .mb3 {margin-bottom:3px !important;} .mb5 {margin-bottom:5px !important;} .mb6 {margin-bottom:6px !important;} .mb8 {margin-bottom:8px !important;} .mb10 {margin-bottom:10px !important;} .mb12 {margin-bottom:12px !important;} .mb15 {margin-bottom:15px !important;} .mb18 {margin-bottom:18px !important;} .mb20 {margin-bottom:20px !important;} .mb24 {margin-bottom:24px !important;} .mb25 {margin-bottom:25px !important;} .mb30 {margin-bottom:30px !important;} .mb35 {margin-bottom:35px !important;} .mb40 {margin-bottom:40px !important;} .mb45 {margin-bottom:45px !important;} .mb50 {margin-bottom:50px !important;} .mr2 {margin-right:2px !important;} .mr5 {margin-right:5px !important;} .mr10 {margin-right:10px !important;} .mr15 {margin-right:15px !important;} .mr20 {margin-right:20px !important;} .mr25 {margin-right:25px !important;} .mr30 {margin-right:30px !important;} .mr1em {margin-right:1em !important;} .mr2em {margin-right:2em !important;} .ml2 {margin-left:2px !important;} .ml5 {margin-left:5px !important;} .ml10 {margin-left:10px !important;} .ml15 {margin-left:15px !important;} .ml20 {margin-left:20px !important;} .ml25 {margin-left:25px !important;} .ml30 {margin-left:30px !important;} .ml1em {margin-left:1em !important;} .ml2em {margin-left:2em !important;} @media screen and (max-width:480px){ /* 10-0 Only Smartphone *----------------------------------------------------------------------*/ #sysMain,#sysAside{ width: 100%!important;} #sysMain{ margin-top: 0;} .grid-col { float: none; width: 100%!important; margin-left: 0; } /* 10-1 Header */ #sysHeader{ margin-bottom: 5px;} .h-siteinfo{ height: auto;} .h-siteinfo h1 { font-size: xx-small;} .h-sitelogo{ height: 52px;} .h-sitelogo li img{ width: auto; max-height: 47px; } .h-utilitybtn{ position: relative;} .h-utilitybtn .sysContent { width: 32%; float: none; position: absolute; z-index: 999; top: 0; right: 15%; } .h-utilitybtn ul li.sysText a { line-height: 17px; height: 47px; font-size: x-small; } .h-utilitybtn ul li { height: 47px; } .h-utilitybtn ul li.sysText a:before { content: ""; width: 20px; margin: 5px auto 0; height: 20px; display: block; } .h-utilitybtn ul li.sysText:nth-child(1) a:before { background: url(/img/icon/icon-mypage.png); background-size: 100%; } .h-utilitybtn ul li.sysText:nth-child(2) a:before { background: url(/img/icon/icon-cart.png); background-size: 100%; } /* 10-1-3 ドロップダウンメニュー */ .h-subMenu .sysHeadline{ line-height: 47px; width: 15%; float: right; position: absolute; bottom: 4px; right: 0; } .h-subMenu ul li:nth-child(2n){ width: 49%!Important; margin-left: 1%; } .h-subMenu ul li.sysText a { line-height: 40px; font-size: larger; font-weight: bold; text-align: center; margin-top: 5px; padding: 30px 0; } /* 12-12 見出し */ .headline-2nd { margin-left: 5px; } .headline-3rd { margin-left: 10px; } /* 12-14 Responsive Grid System */ .col { float: none;} .gutters .col { margin-left: 0;} .span_1,.span_2,.span_3,.span_4,.span_5,.span_6, .span_7,.span_8,.span_9,.span_10,.span_11,.span_12{ width: 100%!Important; float: none; } /* 12-2 Holizontal Item Block */ .sysContent .sysItemBlock .sysHorizontal { font-size: small; } .sysContent .sysItemBlock .sysHorizontal li{ padding: 2.5px; width: 50%; } .sysItemList ul.sysThumbnail li{ width: 50%;} /* 13-1-5 メインメニュー*/ .h-mainMenu ul li { height: 40px;} .h-mainMenu ul li.sysText a { font-size: 0.5rem; padding: 15px 0; } /* 13-1-6 検索フォーム */ .h-search .sysContent{ padding: 5px;} /* 13-2-2 Half Banner */ .p-banner li { width: 100%; margin-bottom: 5px; } /* 13-2-3 PICK UP Item */ .p-pickup .sysContent { padding: 0 0 5px; } /* 13-2-4 News & SNS */ .p-news,.p-sns { width: 100%;} /* 13-2-5 ShopInformation */ .p-shopInfo .sysContent, .shopinfo-inner, .shopinfo-row { display: block;} .shopinfo-inner { width: 100%; } /* 13-4-1 Footer Site Map */ .f-sitemap li { width: 100%!important; } .f-sitemap ul li.sysText a { padding: 10px 20px; text-align: left; } /* 13-4-2 Page Top Btn */ .p-pagetop .btn { width: 90%;} /* 14-1-2 Category Pankuzu */ .sysItemCategoryPankuzu { font-size: xx-small; } /* 14-1-7 Archive Thumbnail Item */ .sysItemList ul.sysThumbnail { font-size: small;} .sysItemList ul.sysThumbnail input { font-size: x-small;} /* 14-2-3 Order Area */ .orderArea { letter-spacing: normal;} .orderArea > div { width: 100%; padding-right: 0; float: none; } /* 14-5-2 MyPage*/ .sysMypageNav .sysButton{ font-size: 0.75rem;} .opcCommonButtonEdit{ border-radius: 5px!important; padding: 10px!important; -webkit-appearance: none; } #sysMain { padding: 0 10px; } #sysAside { padding: 0 10px; } .sysItemImagesSlide { margin-bottom: 20px; } .btn { white-space: normal; } .h-mainMenu ul li.sysText a { font-size: 0.8rem; padding: 2px 10px; } .h-subMenu .sysHeadline { width: 12%; line-height: 40px; right: 5px; font-size: 14px; color: #fff; background: #333; } .h-subMenu .sysAccordionInitialHide { bottom: auto; background: rgba(255,255,255,1); } .h-subMenu ul li.sysText { width: 49% !important; height: 62px; margin: 0; padding: 0; border: 1px solid #000; } .h-subMenu ul li.sysText a { margin: 0; padding: 12px 10px 0; line-height: 60px; font-size: 14px; background-size: 18px auto !important; background-position: center top 8px !important; } .h-subMenu ul li:nth-child(1) { margin-right: 1%; } .h-subMenu ul li:nth-child(2) { margin-left: 1%; } .slick-dots li { margin: 0 2px; } .footerCnt .sysHeadline { margin: 0 10px 30px; } .p-shopInfo .sysContent { padding-right: 10px; padding-left: 10px; } .shopinfo-inner { width: 100%; margin: 10px 0; padding-top: 10px; } .shopinfo-inner:nth-child(2n+1) { margin: 10px 0; } .shopinfo-inner:nth-child(2n) { margin: 10px 0; } #sysFooter { padding: 30px 0 0; } .sysItemList ul.sysList li .sysItemName { font-size: 20px; } .free-page-wrap { padding: 0 5px; } .free-page-wrap header { margin: 0 auto 10px; padding: 10px 0; } .free-page-wrap footer p { margin: 0 auto; } .free-page-cont { margin: 0 auto 60px; } .free-page-wrap #main-bnr { margin: 0 auto 20px; } .detail-info .ebook-trial-area { margin-bottom: 25px; } .detail-info .ebook-area { width: 100%; margin: 0 0 10px; } .detail-info .ebook-area ul { max-width: 320px; margin: 0 auto; padding: 0 10px; } .detail-info .trial-area { width: 100%; margin: 0; } .detail-info .trial-area p { max-width: 320px; margin: 0 auto; padding: 0 10px; } /* NESS */ .ness-wrap { padding: 0 5px; } .ness-demo-cont { padding: 0 10px; } .ness-demo-calculation { padding: 0; } .ness-demo-calculation { font-size: 14px; } .ness-demo-calculation .font-style1 { display: table-cell; padding: 2px 5px; vertical-align: middle; letter-spacing: -0.01em; color: #555; border: 1px solid #999; } .ness-demo-calculation .font-style2 { font-size: 22px; } .ness-demo-calculation .font-style3 { font-size: 16px; } .ness-demo-calculation .font-style4 { display: block; padding-top: 5px; text-align: right; } .ness-demo-list-cont { width: 50%; padding: 0 10px; } .ness-demo-list-cont:nth-child(2n+1) { padding: 0 10px 0 0; } .ness-demo-list-cont:nth-child(2n) { padding: 0 0 0 10px; } /* Webテスト */ .web-test-cont { margin-bottom: 40px; padding: 0 5px; } .web-test-ttl { margin-bottom: 25px; } .web-test-ttl span { font-size: 18px; } .web-test-txt { margin-bottom: 20px; font-size: 16px; } .web-test-list ul li span.txt { display: block; } .web-test-demo-inner { padding: 0 5px; } .web-test-demo-ttl { padding: 6px 10px; font-size: 16px; } .web-test-demo-ttl:before { display: none; } .web-test-demo-box-cont { padding: 18px 15px 16px; } table.web-test-table { width: 100%; } table.web-test-table th { width: 50%; padding: 6px; } table.web-test-table td { padding: 6px; } .web-test-demo-box-cont .btn-img img { width: 160px; } /* リファレンス動画 サンプル */ #reference.wrap #headerInner { padding: 15px 10px; } #reference.wrap #logo img { width: 120px; height: auto; } #reference.wrap #logo span { font-size: 15px; } #reference.wrap #container { padding: 20px 10px 150px; } #reference.wrap #mainTtl { margin-bottom: 25px; font-size: 24px; } #reference.wrap .subTtl { font-weight: normal; font-size: 15px; } #reference.wrap .subTtl span { margin-right: 12px; padding: 8px 15px 6px 20px; font-size: 16px; } #reference.wrap .subTtl2 { margin-bottom: 20px; padding: 0 20px 5px 15px; font-size: 14px; background-position: left 10px; } #reference.wrap .activationMethod .subTtl2 span { display: block; } #reference.wrap .list { margin-bottom: 32px; padding: 20px 15px 10px; } #reference.wrap #pageTop { bottom: 93px; } #reference.wrap #footerContents { display: block; margin: 0 auto; padding: 18px 10px; text-align: center;; } #reference.wrap #siteLink { margin-bottom: 10px; width: 100%; font-size: 14px; } #reference.wrap #siteLink span { padding-right: 18px; background-size: 13px 13px; } #reference.wrap #copyright { width: 100%; text-align: center; font-size: 12px; } .mainCnt .sysHeadline, .for-corporations .sysHeadline, .news-row > h1, #sysMain .sysContent .lower-cont .sysHeadline { font-size: 20px; } } @media screen and (min-width:481px) and (max-width:800px){ /* 20-0 Only Tablet *----------------------------------------------------------------------*/ div#sysMain,div#sysAside{ width: 100%; float: none;}/* PCレイアウトを維持する場合は削除 */ /* 20-1 Header */ .h-utilitybtn { margin:0 5px; } /* 20-1-3 ドロップダウンメニュー */ .h-subMenu .sysHeadline{ width: 30%; float: right; position: absolute; bottom: 5px; right: 5px; } .h-subMenu ul li:nth-child(2n){ width: 49%!Important; margin-left: 1%; } .h-subMenu ul li.sysText a { line-height: 40px; font-size: larger; font-weight: bold; text-align: center; margin-top: 5px; padding: 30px 0; } /* 23-1-5 メインメニュー*/ .h-mainMenu{ border-right: none; border-left: none; } /* 23-1-6 検索フォーム */ .h-search .sysContent{ padding: 5px;} /* 23-3-3 Aside Banner */ .s-banner li { margin: 0 1%; width: 48%; float: left; } .s-banner { overflow: hidden; } /* LoginForm & Search Form */ .s-login,.s-search{ width: 49%; width: -webkit-calc( 50% - .2em); width: calc( 50% - .2em); float: none; overflow: hidden; display: inline-block; vertical-align: top; } .s-login li a{ font-size: 0.75rem; padding: 10px 0; } .s-search.asideCnt .sysItemSearchAndOr label{; display: block; } /* 23-4-2 Page Top Btn */ .p-pagetop .btn { width: 50%;} #sysMain { padding: 0 10px 60px; } #sysAside { padding: 0 10px; } .btn { white-space: normal; } .h-subMenu .sysAccordionInitialHide { bottom: auto; background: rgba(255,255,255,1); } .h-subMenu .sysHeadline { width: 20%; line-height: 40px; right: 5px; font-size: 14px; color: #fff; background: #333; } .h-subMenu ul { display: flex; justify-content: center; } .h-subMenu ul li.sysText { max-width: 200px !important; height: 80px; margin: 0; padding: 0; border: 1px solid #000; } .h-subMenu ul li.sysText a { margin: 0; padding: 10px 10px 0; line-height: 88px; font-size: 14px; background-size: 20px auto !important; background-position: center top 12px !important; } .h-subMenu ul li:nth-child(1) { margin-right: 5px; } .h-subMenu ul li:nth-child(2) { margin-left: 5px; } .shopinfo-inner { width: calc(50% - 12px); } .shopinfo-inner:nth-child(2n+1) { margin: 5px 10px 5px 0; } .shopinfo-inner:nth-child(2n) { margin: 5px 0 5px 10px; } /* NESS */ .ness-demo-list-cont { padding: 0 10px; } /* リファレンス動画 サンプル */ #reference.wrap #logo img.sp { display: block; } #reference.wrap #logo img.pc { display: none; } #reference.wrap #logo img { width: 180px; height: auto; } #reference.wrap #logo span { font-size: 17px; } #reference.wrap .pagePath { display: none; } #reference.wrap #mainTtl { font-size: 30px; } .mainCnt .sysHeadline, .for-corporations .sysHeadline, .news-row > h1, #sysMain .sysContent .lower-cont .sysHeadline { font-size: 24px; } } @media screen and (min-width:801px){ /* 30-0 Only PC *----------------------------------------------------------------------*/ /* 30-1 Header */ .h-siteinfo, .h-subMenu { margin: 0 auto; } .h-siteinfo { text-align: left;} /* 30-1-3 ドロップダウンメニュー */ .h-subMenu > .sysContent { display: block!important;} .h-subMenu > .sysHeadline { display: none;} .h-subMenu .sysAccordionInitialHide { position: absolute; bottom: 1px; right: 0; z-index: 999; width: 40%; background: transparent; } .h-subMenu ul { display: table; width: 100%; } .h-subMenu ul li { display: table-cell; width: auto!important; float: none; text-align: center; } .h-mainMenu nav { width: 70%; border-right: 1px solid; } .h-search .sysContent { width: 30%; position: absolute; top: -55px; height: 50px; right: 0; padding: 5px; } /* 32-9 トグル機能アニメーション */ .h-subMenu .sysAccordionInitialHide { opacity: 1;} /* 33-3-1 Aside Check List */ .s-checklist li > div { width: 90%; margin: 0 auto; } .s-checklist .sysContent .sysVertical .sysItemImage img { width: 100%; float: none; margin: 5px auto; } /* 34-4-1 Footer Site Map */ .f-sitemap .sysContent { width: 95%; margin: 0 auto; } /* 34-4-2 Page Top Btn */ .p-pagetop .sysContent { overflow: hidden; padding: 0 2px; width: 95%; margin: 0 auto; } .p-pagetop .btn { float: right; padding: 10px 20px; } .h-mainMenu nav { border-right: none; } .h-subMenu .sysAccordionInitialHide { bottom: -20px; } .p-pagetop .sysContent { width: 100%; } .free-page-wrap .txt a:hover { text-decoration: none; } .mainCnt.p-notice .for-corporations-info p.for-corporations-btn a:hover { color: #00afe5; background-color: #fff; } .mainCnt.p-notice .bnr-area p a:hover img { opacity: 0.8; } .btn-img a:hover img { opacity: 0.8; } .detail-info .ebook-area ul li a:hover { background: rgba(34,129,197,0.7) url(../img/product-details/icon_book_wt.png) no-repeat left 15px center; } .detail-info .trial-area p a:hover { background: rgba(0,175,229,0.7) url(../img/product-details/icon_pdf.png) no-repeat left 15px center; } /* リファレンス動画 サンプル */ #reference.wrap a { -ms-transition-duration: 0.5s; -o-transition-duration: 0.5s; -moz-transition-duration: 0.5s; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -ms-transition-timing-function: ease-in-out; -o-transition-timing-function: ease-in-out; -moz-transition-timing-function: ease-in-out; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; } #reference.wrap .activationMethod .subTtl2:before { content: ""; position: absolute; z-index: -1; right: 100%; bottom: 0; left: 0; background: #F6AD30; height: 1px; -webkit-transition-property: right; transition-property: right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } #reference.wrap .activationMethod .subTtl2:hover:before, #reference.wrap .activationMethod .subTtl2:focus:before, #reference.wrap .activationMethod .subTtl2:active:before { right: 0; } #reference.wrap .list span.link a { display: inline-block; position: relative; } #reference.wrap .list span.link a:before { content: ""; position: absolute; z-index: 1; right: 100%; bottom: 0; left: 0; height: 1px; -webkit-transition-property: right; transition-property: right; -webkit-transition-duration: 0.3s; transition-duration: 0.3s; -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; } #reference.wrap .officeMoral .list span.link a:before { background: #0369b4; } #reference.wrap .list span.link a:hover:before { right: 0; } #reference.wrap #siteLink span a:hover { text-decoration: underline; } #reference.wrap #pageTop { display: none; } } /* #END_OF_RESOURCE_FILE */