/*########################################################################################## ##// 共通 //################################################################################ ##########################################################################################*/ a { color: #0000FF; overflow: hidden; } a:link { color: #0000ff; } a:visited { color: #0000ff; } a:hover { color: #CC0000; text-decoration: underline; } hr { visibility: hidden; display: none; } *:after { display: block; clear: both; } body { background: #daecff -webkit-gradient(linear, left top, left bottom, from(#6eb1f9), color-stop(0.3, #daecff), to(#daecff)) no-repeat; } #wrapper { width: 320px; margin: 0 auto; background: #ffffff; } #header { background: url(../images/header/h1.jpg) no-repeat; height: 35px; text-indent: -9999px; } #copy { margin: 20px 5px 0 8px; font-size: 70%; } #footer { background: -webkit-gradient(linear, left top, left bottom, from(#1d89d2), to(#4aa8e8)); height: 59px; margin-top: 10px; } #footer p { font-size: 70%; color: #ffffff; text-align: right; padding: 5px; } /*########################################################################################## ##// TOP //################################################################################# ##########################################################################################*/ #visual { position: relative; text-align: center; background: url(/cs/carrier/d/common/images/visual/bg.gif) repeat-x left bottom; } #visual h2 { height: 249px; width: 100%; overflow: hidden; position:relative; } #visual h2 svg { margin-right: auto; margin-left: auto; position:absolute; left:calc( 50% - 270px); } #visual h3 { text-indent: -9999px; background: url(/cs/carrier/d/common/images/visual/h3.jpg) no-repeat center top; height: 85px; } #visual p { text-indent: -9999px; position: absolute; } #about dl { margin: 5px; border-top: 6px solid #d1e8e1;border-right: 1px solid #d1e8e1;border-bottom: 1px solid #d1e8e1; background: #ecfaf3; } #about dl:nth-of-type(1) { margin-top: 10px; } #about dl:nth-of-type(2) { margin-bottom: 10px; } #about dt { padding: 8px; padding-bottom: 0; } #about dt strong { color: #006f4e; /*text-shadow: 1px 0 1px #5c9987;*/ display: block; border-bottom: 1px solid #a8d9ca; padding-bottom: 5px; font-size: 145%; } #about dd { padding: 8px; padding-top: 0; } #about dd strong { display: block; border-top: 1px solid #ffffff; padding-top: 5px; font-size: 90%; } #about span { font-size: 50%; vertical-align: text-top; } /*お支払い登録へ*/ .regist { /*background: -webkit-gradient(linear, left top, left bottom, from(#9cc9f6), to(#e8f4ff));*/ background: -moz-linear-gradient(top, #9cc9f6, #e8f4ff); background: -webkit-gradient(linear, left top, left bottom, from(#9cc9f6), to(#e8f4ff)); filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#9cc9f6', endColorstr='#e8f4ff');/*　IE6・7　*/ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#9cc9f6', endColorstr='#e8f4ff')";/*　IE8　*/ border-left: 1px solid #9cc9f6; border-right: 1px solid #9cc9f6; padding-top: 7px; padding-bottom: 7px; } .regist dl { font-size: 85%; margin: 8px; padding: 2px 10px; background: #e8f4ff; } .regist dt { color: #ff0000; font-weight: bold; margin: 6px 0 3px; font-size: 120%; } .regist dd { line-height: 130%; text-indent: -1em; margin-bottom: 8px; margin-left: 12px; } .regist dd strong { text-decoration: underline; } .regist dl#lnkinfo dd { margin: 0 0 4px 0; } .regist dl#lnkinfo dd a { display:block; font-size: 110%; line-height: 140%; text-indent: 0; padding: 6px 10px 3px 10px; text-align: left; background: #ffffff; } .regist dl#infored { margin: 8px; padding: 2px 10px; color:#fff; background: #cc0000;} .regist dt.infored { color: #fff; font-weight: bold; margin: 6px 0 3px; font-size: 130%; } .regist dd.infored { display:block; font-size: 130%;line-height: 140%; text-indent: 0; padding: 0 12px 5px 12px; text-align: left; color: #fff; } .regist dd a:link.infored { color: #fff; text-decoration: underline; } .regist dd a:visited.infored { color: #fff; text-decoration: underline; } .regist dd a:hover.infored { color: #0000ff; text-decoration: underline; } .regist ul { margin-top: 5px; } .regist li { text-indent: -1em; margin-bottom: 5px; margin-left: 12px; } .regist li strong { text-decoration: none; color: #cc0000; } .regist dd a:link, .regist dd a:visited { color: #0066cc; text-decoration: none; } .regist dd a:hover { color: #cc0000; text-decoration: underline; } /*危険訴求*/ #danger { margin-top: 20px; text-indent: -9999px; background: url(../images/danger.jpg) no-repeat center top; height: 195px; } /*ここが安心*/ #anshin { margin-top: 10px; background: #ddf4ec; padding-bottom: 2px; } #anshin h3 { text-indent: -9999px; background: url(../images/anshin/h3.jpg) no-repeat center top; height: 86px; } #anshin h4 { height: 70px; border-top: 1px solid #ffffff; text-indent: -9999px; } #anshin h4:nth-of-type(1) { background: url(../images/anshin/h4/smph/01.jpg) no-repeat; border-top: none; } #anshin h4:nth-of-type(2) { background: url(../images/anshin/h4/smph/02.jpg) no-repeat; } #anshin h4:nth-of-type(3) { background: url(../images/anshin/h4/smph/03.jpg) no-repeat; } #anshin dl { background: #ffffff; margin: 3px; margin-bottom: 2px; } #anshin dt { padding: 5px 10px; } #anshin dd { text-align: center; padding-bottom: 10px; } #anshin dl:nth-of-type(1) dd, #anshin dl:nth-of-type(2) dd, #anshin dl:nth-of-type(3) dd { padding-top: 10px; } /*安心機能が充実*/ #func { margin-top: 20px; margin-bottom: 30px; background: #ddf3ff; padding-bottom: 2px; } #func h3 { text-indent: -9999px; background: url(../images/func/h3.jpg) no-repeat center top; height: 86px; } #func h4 { height: 54px; border-top: 1px solid #ffffff; text-indent: -9999px; } #func h4:nth-of-type(1) { background: url(../images/func/h4/smph/01.jpg) no-repeat; border-top: none; } #func h4:nth-of-type(2) { background: url(../images/func/h4/smph/02.jpg) no-repeat; } #func dl { background: #ffffff; margin: 3px; margin-bottom: 2px; } #func dt { padding: 5px 10px; } #func dd { text-align: center; padding-bottom: 10px; } #func dl:nth-of-type(2) dd { padding-top: 10px; } h5 { height: 180px; } h6 { text-indent: -9999px; margin-bottom: 10px; height: 133px; background: url(/cs/carrier/d/common/images/h6.jpg); } #btn { margin-top: 20px; } #btn dl { margin: 0 auto; width: 296px; border-bottom: 1px solid #cccccc; margin-bottom: 14px; padding-bottom: 14px; } #btn dt { background: url(../images/btn/smph/dt.jpg) no-repeat; } #btn ul { margin: 0 auto; width: 296px; } #btn li { background: url(../images/btn/smph/li.jpg) no-repeat; } #btn dt, #btn li { height: 47px; color: #ffffff; font-weight: bold; font-size: 140%; text-align: center; } #btn dt a, #btn li a { display: block; width: 296px; height: 34px; padding-top: 13px; text-decoration: none; } #btn dt a { color: #00487a; } #btn li a { color: #ffffff; } #btn dd { margin-left: 5px; margin-right: 5px; } #btn dd strong { display: block; border: 1px solid #9cc9f6; padding: 5px; margin-top: 5px; margin-bottom: 5px; background: #e8f4ff; font-size: 120%; font-weight: bold; color: #00487a; } #btn dd ul { margin-top: 0; padding-top: 0; margin-bottom: 10px; border: none; } #btn dd li { height: auto; background: none; text-align: left; color: #333333; font-size: 80%; text-indent: -1.1em; margin-left: 1.1em; font-weight: normal; } /*対応OS：重要なお知らせ*/ #btn dd p#osinfo { margin: 5px 0; padding: 6px 10px; background: #fff0f0; text-align: left; color: #333333; font-size: 80%; font-weight: normal; line-height: 120%; } #btn dd p#osinfo em { color: #CC0000; font-size: 120%; font-weight: bold; } #btn dd p#osinfo span { color: #CC0000; } #note ul { margin: 10px; margin-top: 20px; } #note li { font-size: 80%; text-indent: -1.4em; margin-left: 1.4em; } button { background: url(/cs/carrier/d/common/images/btn/w140.png) no-repeat; color: #ffffff; font-size: 140%; padding-top: 3px; width: 140px; height: 35px; border: none; margin: 0 auto; display: block; } /*########################################################################################## ##// FAQ //################################################################################# ##########################################################################################*/ #faq { padding: 10px; font-size: 80%; } #faq h2 { font-size: 125%; border-bottom: 2px solid #1d89d2; margin-bottom: 10px; } #faq ul { margin-left: 10px; margin-bottom: 20px; } #faq li { background: url(/cs/carrier/d/common/images/arrow.png) no-repeat; padding-left: 20px; line-height: 18px; color: #177EC1; margin-top: 15px; font-weight: bold; font-size: 160%; } /*########################################################################################## ##// COMPLETE //############################################################################ ##########################################################################################*/ #complete #visual { background: url(../images/complete/visual.jpg); height: 160px; text-indent: -9999px; } #complete #main { margin: 10px; } #complete #main h3 { font-size: 145%; color: #ff0000; font-weight: bold; margin-bottom: 10px; } #complete #main p { margin-bottom: 10px; } #complete #main p:nth-of-type(2) { text-align: center; } #complete #main ul { margin-bottom: 30px; } #complete #main li { font-size: 80%; text-indent: -0.8em; margin-left: 0.8em; } /*au、softbank追加時（12/05/29）*/ .regist h4.btn { text-indent: -9999px; background: url(../images/regist02/smph.png) no-repeat -1px 0; } .regist h4.btn a { display: block; width: 307px; height: 70px; margin-left: 5px; } .regist h3 { width: 320px; height: 58px; text-indent: -9999px; background: url(../images/regist/h3.png) no-repeat center top; margin: 0 auto; } .regist h4 { text-indent: -9999px; } .regist h4 a { display: block; width: 307px; height: 54px; margin-left: 5px; } .regist h4.docomo { background: url(../images/regist/smph/docomo.png) no-repeat; } .regist h4.au { background: url(../images/regist/smph/au.png) no-repeat; } .regist h4.softbank { background: url(../images/regist/smph/softbank.png) no-repeat; } #btn h4 { position: relative; height: 20px; margin-top: 30px; margin-bottom: -5px; } #btn h4 span { display: block; height: 2px; width: 90%; margin: 0 auto; background: #cccccc; } #btn h4 strong { display: block; position: absolute; font-size: 120%; top: -8px; left: 50%; width: 200px; height: 20px; background: #ffffff; margin-left: -100px; text-align: center; } #trade, #charge { padding: 10px; font-size: 80%; } #trade h2, #charge h2 { font-size: 125%; border-bottom: 2px solid #1d89d2; margin-bottom: 10px; } #trade table, #charge table { width: 95%; margin: 0 auto; margin-bottom: 10px; font-size: 110%; border: 1px solid #1d89d2; } #trade th, #charge th { background: #b2e0ff; padding: 5px; border-top: 1px solid #1d89d2; border-bottom: 1px dotted #1d89d2; color: #08314d; font-size: 110%; } #trade td, #charge td { padding: 5px; }