@charset "UTF-8"; /*sopport以下 共通設定*/ /*マージン*/ .mar_l60{ margin-left:60px !important; } .mar_l100{ margin-left:100px !important; } /*寄せ*/ .align-c{ text-align:center;} /*画像回り込み回避*/ .nowrap { overflow:hidden;} /*モバイル表示時改行*/ .fl-l_pc { float:left; } @media screen and (max-width: 640px) { .fl-l_pc { float:none; } } /*PC/SP改行指定*/ br.pc_only { display:block; } br.sp_only { display:none; } @media screen and (max-width: 640px) { br.pc_only { display:none; } br.sp_only { display:block; } } /*カレンダー*/ .callcenter-cal ul { list-style: none; margin: 0; padding: 0; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-justify-content: center; justify-content: center; margin: 0 0 -20px -20px; } .callcenter-cal-grid4 li { width: calc((100% - 20px * 4) / 4); margin-left: 20px; margin-bottom: 20px; } @media screen and (max-width: 640px) { .callcenter-cal-grid4 li { width: calc((100% - 20px * 2) / 2); margin-left: 10px; margin-bottom: 20px; } } .mod-tableSet_cal table { border-collapse: collapse; border-spacing: 0; width: 100%; } .mod-tableSet_cal th, .mod-tableSet_cal td { border: solid 1px #fff; padding: 10px 0; text-align: center; vertical-align: top; font-weight: normal; } .mod-tableSet_cal th { background: #d2d4d9; } .mod-tableSet_cal td { background: #f2f2f2; } .mod-tableSet_cal table caption { font-weight:bold; } .mod-tableSet_cal table td.red { background: #ffcccc; color: #c00; font-weight:bold; } .mod-tableSet_cal table td.blue { background: #ebf1ff; color: #0039ae; font-weight:bold; } @media screen and (max-width: 640px) { /*画像はみ出し回避*/ p.mod-paragraph img.w100p{ width:100%; } .mod-media_spbm { overflow:auto; margin-bottom:40px; } } /*電話混雑状況のマーク*/ .img_connect_mark { width: 35px; } @media screen and (max-width: 640px) { .mod-freeTableSet1 .mod-freeTableSet1_connect_mark { padding: 5px !important; } } /*赤字のページ内アンカー*/ .mod-inlineAnchor_red { border-bottom: dotted 1px #c51324 !important; color: #c51324 !important; } .mod-inlineAnchor_red:after { border-top: 2px solid #c51324 !important; border-right: 2px solid #c51324 !important; } /*エコポイント活動 mapの背景色*/ .mapcolor{ background-color:#ececec; padding:20px; } /*文字サイズ*/ .mod-textSize30 { font-size: 30px !important; } /*OKWAVE 質問投稿の利用手順*/ #support_info_okwave .pro_bg1{ background-image:url(/~/media/cojp/product/support_info/img/okwave/pro_bg1); background-repeat:no-repeat; width:436px; height:387px; float:left; } #support_info_okwave .pro_bg2{ background-image:url(/~/media/cojp/product/support_info/img/okwave/pro_bg2); background-repeat:no-repeat; width:459px; height:387px; float:left; } #support_info_okwave .pro_bg3{ background-image:url(/~/media/cojp/product/support_info/img/okwave/pro_bg3); background-repeat:no-repeat; width:999px; height:273px; } #support_info_okwave .pro_bg4{ background-image:url(/~/media/cojp/product/support_info/img/okwave/pro_bg4); background-repeat:no-repeat; width:436px; height:313px; float:left; } #support_info_okwave .pro_bg5{ background-image:url(/~/media/cojp/product/support_info/img/okwave/pro_bg5); background-repeat:no-repeat; width:459px; height:313px; float:left; } #support_info_okwave .pro1{ width:436px; height:367px; padding-top:20px; text-align:center; } #support_info_okwave .pro1 h6{ color:#666; font-size:1.2em; font-weight:bold; margin:0; } #support_info_okwave .pro1_main{ color:#666; font-size:100%; margin-top:15px; text-align:center; padding:0 50px 0; } #support_info_okwave .ballon{ padding:20px 10px 20px; text-align:center; } #support_info_okwave .pro1_main span{ color:#3114ED; font-weight:bold; } .pro_arrow1{ float:left; margin: 161px 10px 0 15px; } #support_info_okwave .pro2{ width:459px; height:367px; padding-top:20px; text-align:center; } #support_info_okwave .pro2 h6{ color:#666; font-size:1.2em; font-weight:bold; margin:0; } .pro_arrow2{ margin: 0 737px; clear: both; padding: 15px 0 10px 0; } #support_info_okwave .pro3{ width:999px; height:253px; padding-top:20px; text-align:center; } #support_info_okwave .pro3 h6{ color:#666; font-size:1.2em; font-weight:bold; margin:0; } #support_info_okwave .pro3_main{ color:#666; font-size:100%; margin-top:18px; width:340px; padding-left:175px; } .pro_arrow3{ margin: 0 186px; padding: 15px 0 10px 0; } #support_info_okwave .pro4{ width:436px; padding-top:20px; text-align:center; } #support_info_okwave .pro4 h6{ color:#666; font-size:1.5em; font-weight:bold; margin:0; } #support_info_okwave .pro4_main{ color:#666; font-size:120%; margin-top:20px; text-align:center; padding:0 35px 0; } .pro_arrow4{ float:left; margin: 124px 10px 0 15px; } #support_info_okwave .pro5{ width:459px; padding-top:20px; text-align:center; } #support_info_okwave .pro5 h6{ color:#666; font-size:1.5em; font-weight:bold; margin:0; } #support_info_okwave .pro5_main{ color:#666; font-size:100%; text-align:center; padding-left:136px; width:265px; } @media screen and (max-width: 640px) { .pro_arrow1 ,.pro_arrow2 ,.pro_arrow3 ,.pro_arrow4{ display:none; } #support_info_okwave .pro_bg1 ,#support_info_okwave .pro_bg2 ,#support_info_okwave .pro_bg4 ,#support_info_okwave .pro_bg5{ float:none; width:100%; background-size:100%; height:auto; } #support_info_okwave .pro_bg3{ background-image:url(/~/media/cojp/product/support_info/img/okwave/sp_pro_bg3); width:100%; background-size:100%; height:auto; } #support_info_okwave .pro_bg1:after ,#support_info_okwave .pro_bg2:after ,#support_info_okwave .pro_bg3:after ,#support_info_okwave .pro_bg4:after{ content: url(/~/media/cojp/product/support_info/img/okwave/v_arrow); margin-left:40%; } #support_info_okwave .pro1 ,#support_info_okwave .pro2 ,#support_info_okwave .pro3 ,#support_info_okwave .pro4 ,#support_info_okwave .pro5{ width:100%; height:auto; } #support_info_okwave .pro1{ padding-bottom:54%; } #support_info_okwave .pro2{ padding-bottom:75%; } #support_info_okwave .pro3{ padding-bottom:55%; } #support_info_okwave .pro4{ padding-bottom:63%; } #support_info_okwave .pro5{ padding-bottom:35%; } #support_info_okwave .pro1 h6 ,#support_info_okwave .pro2 h6 ,#support_info_okwave .pro3 h6 ,#support_info_okwave .pro4 h6 ,#support_info_okwave .pro5 h6{ font-size:1em; } #support_info_okwave .pro1_main ,#support_info_okwave .pro3_main{ font-size:85%; padding: 0 10% 0; } #support_info_okwave .pro5_main{ font-size:85%; margin-top:10px; padding: 0 13% 0 30%; width:auto; } #support_info_okwave .pro3_main{ width:auto; } #support_info_okwave .ballon{ padding:5px; } } @media screen and (max-width: 370px) { #support_info_okwave .pro1{ padding-bottom:50%; } #support_info_okwave .pro3{ padding-bottom:48%; } } @media screen and (max-width: 350px) { #support_info_okwave .pro1{ padding-bottom:48%; } #support_info_okwave .pro3{ padding-bottom:45%; } #support_info_okwave .pro5{ padding-bottom:30%; } #support_info_okwave .ballon{ line-height:1.3; } } /*ベルマーク*/ .childquestion ul { list-style-type:none; -webkit-padding-start: 0; -webkit-margin-before: 0; -webkit-margin-after: 0; margin-left: -20px; margin-bottom: -20px; display: flex; flex-wrap: wrap; padding:0; } .childquestion li { width: calc((100% - 20px * 2) / 2); margin-left: 20px; margin-bottom: 20px; padding: 10px 15px 7px; background: #f2f2f2; box-sizing: border-box; display: flex; } .child { width: 97px; min-height: 146px; box-sizing: border-box; padding: 0; -webkit-flex-shrink: 0; flex-shrink: 0; display: inline-block; position: relative; } .question { margin: 0; padding-left: 20px; line-height: 1.5; width:100% } .quest-balloon{ position: relative; padding: 20px 20px 40px 20px; background-color: #fff; border-radius: 10px; width:85%; margin-top:20px; } .quest-balloon::before{ content: ''; position: absolute; display: block; width: 0; height: 0; left: -15px; top: 20px; border-right: 15px solid #fff; border-top: 15px solid transparent; border-bottom: 15px solid transparent; } .quest-balloon a:before { content: ""; display: inline-block; vertical-align: middle; text-decoration: none; width: 6px; height: 6px; border-top: 2px solid #333; border-right: 2px solid #333; -webkit-transform: rotate(45deg); transform: rotate(135deg); margin-top: -.25em; margin-right: 8px; } @media screen and (max-width: 640px) { .childquestion li { width: 100%; padding: 12px 15px 12px; } .child { width:60px; min-height:90px; } .child img{ width:100%; } .quest-balloon{ margin-top:0; font-size: 0.95em; padding: 15px 15px 40px 15px; } } /*純正インク*/ .mod-contentsNav3_original li { width: calc((100% - 20px * 4) / 4) !important; } .mod-contentsNav3_original_content { display: block; } @media screen and (max-width: 640px) { .mod-contentsNav3_original li { width: calc((100% - 20px * 2) / 2) !important; } .mod-contentsNav3_original_content { padding: 10px; display: block; } }