@charset "UTF-8"; /*** リセット ***/ html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, pre, a, em, font, img, strong, sub, sup, dl, dt, dd, ol, ul, li, form, label, table, caption, tr, td { margin: 0; padding: 0; border: 0; outline: 0; * font-size: 100%; font-weight: inherit; font-style: inherit; text-align: left; } body { color: #333; line-height: 1.5; font-size: 16px; font-size: 1.6rem; font-family:"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ","MS Pゴシック",sans-serif; font-style: normal; font-weight: normal; } html { * min-width: 320px; font-size: 62.5%;/*10px*/ height: 100%; } h1 { margin: 0; } h2 { margin: 0; } h3 { margin: 0; font-weight:bold; } h4 { margin: 0; } h5 { margin: 0; } h6 { margin: 0; } img,video { max-width: 100%; height: auto; display:block; } /*clearfix*/ .clearfix:after { content: ""; display: block; clear: both; } .clearfix { zoom: 1; } ul,li { list-style:none; } .noSP { display: block; } .noPC { display:none; } /* テキストリンク */ a:link { text-decoration:none; color:#0053B2; } a:visited { text-decoration:none; color:#FF0000; } a:hover { text-decoration:underline; color:#0FA740; } a:active { text-decoration:none; color:#0FA740; } .clear { clear: both; } /*layout ----------------------------------*/ #wrapper { position: relative; margin: 0; background:#fffcd9; } #header { background: #FFF; } #header .logo { padding: 0 5px; } /*navigation*/ #navControl { margin-top:-44px; text-align: right; } #navControl a { display: inline-block; overflow: hidden; width: 44px; height: 44px; background: #114f9b url(/content/images/mc/img/icon_common.png) no-repeat 0 0; text-indent: 100%; white-space: nowrap; vertical-align: bottom; } #navControl a.active { background-position: 0 -44px; } #header nav { margin-bottom: 0; } #header nav ul#globalNav { margin: 0; padding: 0; } #header nav ul#globalNav li{ border-bottom: 1px solid #fff; } #header nav ul#globalNav li a { display: block; padding: 7px; background: #114f9b; color: #fff; text-decoration: none; -webkit-tap-highlight-color: rgba(17,79,155,0.3); } #header nav ul#globalNav li a:hover{ background-color: #364484; } h1.hTtl { background:url(/content/images/mc/pr/h1_main_bg.png) repeat-x; } h2.hTtl { background:url(/content/images/mc/pr/h2_hbg.png) repeat-x; } #point { background:url(/content/images/mc/pr/point_bg.png); padding:7px 4px 0; margin:0; border:3px solid #33804d; } #point h2 { background:none; padding:0; margin:0; border:none; } #point img { margin:0 auto 7px; } .shadow { height:7px; background:url(/content/images/mc/pr/point_shadow.png) bottom repeat-x; margin:0 0 15px; } h2.ttlP { margin:0 5px 20px; padding:4px 5px; border:1px solid rgb(0, 129, 32); border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; background-img:url(/content/images/mc/pr/point_shadow.png); background: rgb(67,192,113); /* Old browsers */ background: -moz-linear-gradient(top, rgba(67,192,113,1) 0%, rgba(43,168,89,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(67,192,113,1) 0%,rgba(43,168,89,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(67,192,113,1) 0%,rgba(43,168,89,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43c071', endColorstr='#2ba859',GradientType=0 ); /* IE6-9 */ box-shadow:rgb(207, 207, 207) 1px 2px 2px 0px; -webkit-box-shadow:rgb(207, 207, 207) 1px 2px 2px 0px; -moz-box-shadow:rgb(207, 207, 207) 1px 2px 2px 0px; } h4.ttlP { margin:20px 0; padding:5px 10px; border:1px solid rgb(0, 129, 32); border-radius:6px; -webkit-border-radius:6px; -moz-border-radius:6px; background-img:url(/content/images/mc/pr/point_shadow.png); background: rgb(67,192,113); /* Old browsers */ background: -moz-linear-gradient(top, rgba(67,192,113,1) 0%, rgba(43,168,89,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(67,192,113,1) 0%,rgba(43,168,89,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(67,192,113,1) 0%,rgba(43,168,89,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43c071', endColorstr='#2ba859',GradientType=0 ); /* IE6-9 */ box-shadow:rgb(207, 207, 207) 1px 2px 2px 0px; -webkit-box-shadow:rgb(207, 207, 207) 1px 2px 2px 0px; -moz-box-shadow:rgb(207, 207, 207) 1px 2px 2px 0px; } #blP { margin:0 1px 35px; background:#FFF; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; border:2px solid #02853b; box-shadow:rgba(0, 0, 0, 0.298039) 1px 2px 2px 1px; -webkit-box-shadow:rgba(0, 0, 0, 0.298039) 1px 2px 2px 1px; -moz-box-shadow:rgba(0, 0, 0, 0.298039) 1px 2px 2px 1px; } #blP h2 { padding:6px 0 4px 10px; margin:0; border-radius:6px 6px 0px 0px; -webkit-border-radius:6px 6px 0px 0px; -moz-border-radius:6px 6px 0px 0px; background: rgb(29,146,79); /* Old browsers */ background: -moz-linear-gradient(top, rgba(29,146,79,1) 0%, rgba(5,121,54,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(29,146,79,1) 0%,rgba(5,121,54,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(29,146,79,1) 0%,rgba(5,121,54,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1d924f', endColorstr='#057936',GradientType=0 ); /* IE6-9 */ } #blP h3 { padding:12px 0 12px 10px; margin:0; background: rgb(243,253,236); /* Old browsers */ background: -moz-linear-gradient(top, rgba(243,253,236,1) 0%, rgba(221,241,218,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(243,253,236,1) 0%,rgba(221,241,218,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(243,253,236,1) 0%,rgba(221,241,218,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f3fdec', endColorstr='#ddf1da',GradientType=0 ); /* IE6-9 */ border-bottom:2px solid #02853b; } #inner { padding:10px 10px; margin:0; } #inner img.p1img { width:241px; margin:20px auto; } #innerBl { margin:0 5px 20px; padding:0 0 10px; border:3px solid #e78b18; background:#fcf7e6; border-radius:8px; -webkit-border-radius:8px; -moz-border-radius:8px; box-shadow:rgba(0, 0, 0, 0.298039) 1px 2px 2px 1px; -webkit-box-shadow:rgba(0, 0, 0, 0.298039) 1px 2px 2px 1px; -moz-box-shadow:rgba(0, 0, 0, 0.298039) 1px 2px 2px 1px; } #innerBl h4 { padding:7px 7px 5px; margin:0 auto; text-align:center; border-radius:4px 4px 0px 0px; -webkit-border-radius:4px 4px 0px 0px; -moz-border-radius:4px 4px 0px 0px; background: rgb(231,144,25); /* Old browsers */ background: -moz-linear-gradient(top, rgba(231,144,25,1) 0%, rgba(228,122,3,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(231,144,25,1) 0%,rgba(228,122,3,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(231,144,25,1) 0%,rgba(228,122,3,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e79019', endColorstr='#e47a03',GradientType=0 ); /* IE6-9 */ } #innerBl h4 img { display:none; } #friTxt { padding:10px; } .p1iImg { margin:20px auto; } #friTxt2 { padding:10px 5px; } #friTxt2 img { margin:10px auto 0; } table { width:100%; border-collapse:collapse; border-spacing:0; margin:0 0 20px; } td { border:1px solid #a9a9a9; padding:3px 5px; font-size:12px; line-height:1.5; } td.clr1 { background-color:#00ad46; font-weight:bold; color:#FFF; } td.clr2 { background-color:#b8e6a7; text-align:center; } td.clr3 { width:3em; background-color:#dcf7d6; text-align:center; } td.clr4 { width:6.5em; background-color:#f3fee6; text-align:center; } .checkP { margin:0 0 20px; } .line { clear:both; border-bottom:1px dotted #666666; margin:30px 0; } .th1B { display:none; } .point1_1B { display:none; } .point1_2B { display:none; } #footer { text-align:center; padding:0 5px 20px; } #footer img { margin:0 auto 10px; } /*media Queries タブレット ----------------------------------------------------*/ @media only screen and (min-width:640px) { #point h2 img.noPC { display:block; margin:0 auto 10px; } #point h2 img.noSP { display:none; } #point a img.noPC { display:block; } #point a img.noSP { display:none; } .th1B { display:block; } .th1S { display:none; } .point1_1B { display:block; margin:20px 0; } .point1_1S { display:none; } .point1_2B { display:block; } .point1_2S { display:none; } h2.ttlP { padding:5px 0 5px 13px; } h2.ttlP img { display:block; } h2.ttlP .noSP { display:none; } h3 .noPC { display:block; } h3 .noSP { display:none; } h4.ttlP { padding:5px 10px; margin:20px 0; } h4.ttlP img { display:block; } h4.ttlP .noSP { display:none; } #blP h3 {* padding:12px 10px 5px; } #innerBl h4 img { display:block; } #innerBl h4 .noSP { display:none; } #friTxt2 .noPC { display:block; } #friTxt2 .noSP { display:none; } #blP a img.noPC { display:block; } #blP a img.noSP { display:none; } #inner h5 img.noPC { display:block; } #inner h5 .noSP { display:none; } img.explanaP { display:block; } img.explanaS { display:none; } #footer img.noPC { display:block; } #footer img.noSP { display:none; } } /*media Queries PC ----------------------------------------------------*/ @media only screen and (min-width:900px) { html { * font-size:14px;/*10px*/ } body { line-height: 1.7; font-size: 16px; font-size: 1.6rem; } .noSP { display:none; } .noPC { display:inline; } /* ヘッダー */ #header { display: block; width: 900px; height: auto; text-align:left; background:url(/content/images/mc/pr/bg.png) repeat-y; line-height:100%; } #header #cNav { width: 898px; height: 51px; margin:0 auto; background: #FFF; } #header .logo { padding: 0 15px; } /* グローバルメニュー ----------------------------------------------------*/ #navControl { display:none; } #header #gnav { display: block; width: 900px; height: 36px; } #header #gnav .menu { float:left; } /* レイアウト */ #wrapper { height: auto; width: 900px; margin: 0 auto; padding: 0; background:url(/content/images/mc/pr/bg.png) repeat-y; border-bottom:1px solid #000; } #content { width: 898px; height: auto; padding:0 1px; } h1.hTtl { background:url(/content/images/mc/pr/main.jpg) no-repeat; margin:0; padding:0; } #point { background:url(/content/images/mc/pr/point_bg.png); padding:12px 0 5px; margin:0; border:5px solid #33804d; } #point h2 img.noPC { display:block; width:572px; margin:0 auto 20px; } #point img { margin:0 auto 10px; } .shadow { height:10px; background:url(/content/images/mc/pr/point_shadow.png) repeat-x; margin:0 0 35px; } h2.ttlP { margin:0 31px 20px; padding:7px 0 7px 15px; } #blP { width:830px; margin:0 auto 35px; } #blP h2 { padding:12px 0 10px 13px; margin:0; } #blP h3 { padding:14px 0 8px 30px; margin:0; } #inner { padding:20px 24px; margin:0; } #inner img { margin:0 auto; } #innerBl { width:790px; margin:0 auto 20px; } #innerBl h4 { padding:9px 5px 2px; } #innerBl h4 img { display:inline; } #friTxt { padding:20px; } .p1iImg { margin:20px 11px; } .btSearch { width:684px; margin:0 auto; } #friTxt2 { padding:20px 16px 6px; } h4.ttlP { margin:30px 0; padding:7px 10px; } #inner h4.ttlP img { margin:0; } h4.sttlP { width:790px; margin:10px auto 10px; } h4.sttlP img { margin:0; } table { width:480px; float:left; margin:0 25px 30px 0; } td { border:1px solid #a9a9a9; padding:5px 10px; } td.clr1 { width:473px; } .line { clear:both; border-bottom:1px dotted #666666; margin:30px 0; } #inner img.btSearch { margin:30px auto; } #inner img.point1_1B { margin:20px 0; } #footer { text-align:center; padding:0 0 20px; } #footer img { margin:0 auto 10px; } } .white { color:#fff;font-weight:bold; } .red { color:#e51811; } .mtb25 { margin:25px 0; } .mt20 { margin-top:20px; } .mt30 { margin-top:30px; } .mb5 { margin-bottom:5px; } .mb20 { margin-bottom:20px; } .mb30 { margin-bottom:30px; } .mb40 { margin-bottom:40px; }