//////////////////////////////// //D-Markingのオリジナルベース //////////////////////////////// //スタイルを入れ替える前にリセットするcss .reset{ margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; line-height:1; font-weight:bold; font-style:normal; .border-radius( 0px ) ; color: inherit; //text-decoration:none; //display:block; } ////////////////////////////////PC&モバイル分岐//////////////////////////////// .mob_br{display: none}//モバイルのみ改行するbr .pc_none{display: none}// PCでは表示させない .pc_none2{display:none} @media screen and (max-width: 736px){ .mob_br{display: inline-block} .pc_none{display: inherit} .pc_none2{display: inline} .mob_none,.mob_non,.no_br{ display: none}//モバイルでは表示させない }//@media screen and (max-width: 736px) .pc_br_div{br{}}//////////////////////////この中の改行はモバイルではされない @media screen and (max-width: 736px){ .pc_br_div{br{ display: none;}} } //////////////////////////////////////////////////////////////////////// ////////////////////////////////PC&ノートモバイル分岐例//////////////////////////////// //3つのブロックを作成して、それぞれを表示させる //pc p.pc_bio{display: block;} p.note_bio{display: none;} p.mob_bio{display: none;} @media screen and (max-width: 736px) { //モバイル p.pc_bio {display: none;} p.note_bio{display: none;} p.mob_bio {display: block;} } @media screen and (max-height: 900px) and (min-width: 737px) { //ノート 幅はモバイル以上だが、 // 高さが900px以下の場合 .top_prof p.pc_bio {display: none;} .top_prof p.note_bio{display: block;} .top_prof p.mob_bio {display: none;} } ////////////////////////////////D-Marking 独自クラス////////////////////////////// ////////////////////////////////イメージ//////////////////////////////// a img:hover{ opacity:0.7; filter: alpha(opacity=70); //ie lt 8 -ms-filter: "alpha(opacity=70)"; //ie 8 -moz-opacity:0.7; //FF lt 1.5, Netscape -khtml-opacity: 0.7; //Safari 1.x } a:hover img{ opacity:0.7; filter: alpha(opacity=70); // ie lt 8 -ms-filter: "alpha(opacity=70)"; // ie 8 -moz-opacity:0.7; // FF lt 1.5, Netscape -khtml-opacity: 0.7; // Safari 1.x } //透明化させない a:hover img.no_dhover,#img_box2 img{ opacity:1; filter: alpha(opacity=100); // ie lt 8 -ms-filter: "alpha(opacity=100)"; // ie 8 -moz-opacity:1; // FF lt 1.5, Netscape -khtml-opacity: 1; // Safari 1.x } //透明化少し a:hover img.no_hover2 { opacity:0.9; filter: alpha(opacity=90); // ie lt 8 -ms-filter: "alpha(opacity=90)"; // ie 8 -moz-opacity:0.9; // FF lt 1.5, Netscape -khtml-opacity: 0.9; // Safari 1.x } }//@media screen 737px 以上はこれ .maru_img{.border-radius(50%)} ////////////////////////////////フォント//////////////////////////////// .mincho{ font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN","HG明朝E","MS P明朝","MS 明朝",serif; } .border{ border:solid #ccc 1px;} .tel_font{font-family: 'Roboto Condensed', sans-serif;} .day_font{font-family: 'Fjalla One', sans-serif;} .sub_font{ //font-family: 'Crimson Text', serif; //font-family: 'Teko', sans-serif; //font-family: 'Coda', cursive; //font-family: 'Titillium Web', sans-serif; //font-family: 'Caveat Brush', cursive; font-family: 'Kaushan Script', cursive; } ////////////////////////////////フロート//////////////////////////////// //site0より ///*フロート解除用*/ .clearfix:after,#d_contents_in:after, .tax_top_menu:after{ content: ''; display: block; clear: both; } .clearfix,#d_contents_in { zoom: 1; /* for IE6/7 */ } .img_right{ float: right; margin-left: 15px; margin-bottom: 15px; } .img_left{ float: left; margin-right: 15px; margin-bottom: 15px; } .img_waku{ padding: 5px; border: 1px solid #CCC; } @media screen and (max-width: 736px) { .img_right,.img_left{float: none; margin-left: auto; margin-right:auto; text-align: center; } //.img_waku{width: 100%!important; margin-left: 0px; margin-right: 0px; img{width: 100%; height: auto;}} } /////////////////////////////////*角とり*///////////////////////////////// .img_kado_ue{ -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px;} .kado10{.border-radius(10px)} /////////////////////////////////*装飾*///////////////////////////////// /*-------------------------------- 簡易CSS ---------------------------------*/ .dbold{ font-weight: bold; } .dred{ color: #F00; } .dblue{ color: #00F; } .dsky{ color: #06F; } .dgreen{ color: #3C0; } ///ここまで //太線 .dbold,.d_bold{font-weight: bold;} //戻し 強制力があります。 スタイルに組み込まず、クラスで後付てください。 class="adb d_normal" .d_normal,.dnormal, .f_normal, .fnormal{font-weight: normal!important;} //線囲いBOX .border_box{padding: 12px; border: solid 1px #ccc;} .border_boxa{padding: 12px; border: solid 1px #333;} .border_box1{padding: 24px; border: solid 1px #ccc;} .border_box2{padding: 24px; border: solid 2px #ccc;} /////////////////////////////////*リンク*///////////////////////////////// //リンクテクストカラー .link_color{color:@link_color!important} .link_color:hover{color:@link_color; text-decoration: underline;} .link_color_under{color:@link_color; text-decoration: underline;} .link_color_under:hover{color:@link_color; text-decoration: none;} /////////////////////////////////*リスト*///////////////////////////////// //削除したリストスタイルを元に戻すクラス .list li{list-style-type: disc; margin-left: 1em; margin-bottom: 12px; font-size: 110%;} .list0 li{list-style-type: disc; margin-left: 1em; margin-bottom: 12px; } //リストの入った画像とリストボックス ??未検証?? //bodyでポイントアップ上書き body .list_box{ padding: 24px; //フロート時 リストのマージンと相殺されるため倍 .img_box{margin-left: 44px;} .img_box_left{margin-right: 44px;} @media screen and (max-width: 736px){ //モバイルは0 .img_box{margin-left: 0px;} .img_box_left{margin-right: 0px;} }//@media screen and (max-width: 736px) } ////////////////////////////////D-Marking オリジナルリセット?////////////////////////////// .test_icon{font-size:100% } //文字下線 黄色 .pickup_span, .puckup_sapn{background: linear-gradient(transparent 60%, rgba(255,241,144,1.00) 50%);} .pickup_span50, .puckup_sapn50{ background:linear-gradient(transparent 60%, rgba(255,241,144,0.50) 50%)} //文字下線 クレー .pickup_span_gray, .puckup_sapn_gray{background: linear-gradient(transparent 60%, #e4e4e4 50%);} //サイトメインカラー仕様 .pickup_span_d, .puckup_sapn_d{background: linear-gradient(transparent 60%, @site_color_pastel3 50%);} .puckup_sapn_d { background:linear-gradient(transparent 60%, rgba(99, 242, 199, 0.5) 50%)} //コンタクトフォーム 送信完了ページの場合 //.thanks_ari{ //.wpcf7-mail-sent-ok{display: none!important} // } //センターイメージ .center{text-align: center; img{max-width: 100%;}} .pc_center{ text-align: center; } //インラインblock要素 .box_center{margin-left: auto; margin-right: auto; display: block; } @media screen and (max-width: 736px){ .pc_center{ text-align: left; } }//@media screen and (max-width: 736px)