★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */ /* ================================================================================ レイアウト ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { #wrapper{ background:url(../img/) center top no-repeat; } main.outer_wrap{ position:relative; width:100%; min-height:50vh; background:url(../img/) center top no-repeat; display:block; padding:80px 0 120px; margin: 10vw auto 0; background-color:#f8f8f8; } .inner_wrap{ position:relative; width:100%; margin:0 auto; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { #wrapper{ background:url(../img/) center top no-repeat; } main.outer_wrap{ position:relative; width:100%; background:url(../img/) center top no-repeat; padding:40px 0; background-color:#f8f8f8; } .inner_wrap{ position:relative; width:100%; padding:0 16px; } } /* ================================================================================ 各メイン画像 ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .m-cate_wrap{ position: relative; background-color: #f4f3f3; background:url(../img/cate_bg.jpg)center top no-repeat; background-size:100% auto;/*この場合は高さが自動設定*/ width: auto; height:21vw; margin: 0 auto; padding: 0; } .m-cate_wrap_in{ width:100%; height:100%; display:table; } .m-cate_wrap_in h2{ display:table-cell; text-align:center; vertical-align:middle; font-size:2.5vw; letter-spacing:0.05em; line-height:0.8; color:#ea5935; padding-top: 26vw; } .m-cate_wrap_in h2 span{ font-size:1.25vw; font-weight:300; } /* 採用情報 */ .m-cate_wrap_recruit{ height:46vw; } .m-cate_recruit{ background:url(../img/main_recruit.jpg) center top no-repeat; background-size:cover; background-size:100% auto; } .m-cate_recruit h2{ display:table-cell; text-align:center; vertical-align:middle; font-size:3vw; letter-spacing:0.05em; line-height:0.8; color:#ea5935; padding-top:5vw; } .m-cate_recruit h2 span{ font-size:1.5vw; font-weight:300; } .m-cate_wrap_in.m-cate_recruit_bottom h2{ padding-top: 7vw; vertical-align: top; font-weight:300; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .m-cate_wrap{ position: relative; background-color: #f4f3f3; background:url(../img/cate_bg.jpg)center top no-repeat; background-size: auto 100%;/*この場合は高さが自動設定*/ background-color: #fff4e0; width: auto; height:50vw; } .m-cate_wrap_in{ width:100%; height: 102%; display:table; } .m-cate_wrap_in h2{ display:table-cell; text-align:center; vertical-align:middle; font-size:6vw; letter-spacing:0.05em; line-height:0.8; color:#FFFFFF; } .m-cate_wrap_in h2 span{ font-size:3vw; font-weight:300; color:#FFFFFF; } /* 採用情報 */ .m-cate_wrap_recruit{ height:46vw; } .m-cate_recruit{ background:url(../img/main_recruit.jpg) center top no-repeat; background-size:cover; background-size:100% auto; } .m-cate_recruit h2{ display:table-cell; text-align:center; vertical-align:middle; font-size:6vw; letter-spacing:0.05em; line-height:0.8; color:#ea5935; padding-top:5vw; } .m-cate_recruit h2 span{ font-size:1.5vw; font-weight:300; } .m-cate_wrap_in.m-cate_recruit_bottom h2{ padding-top: 8vw; vertical-align: top; font-weight:300; font-size:4vw; color:#ea5935; } } /* SP設定(採用メッセージ用指定 ----------------------------------------------- */ @media (max-width: 460px) { .m-cate_wrap_in.m-cate_recruit_bottom h2{ padding-top: 16vw; font-size:6vw; } } /* ================================================================================ セクション ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { /* 2カラム ----------------------------------------------- */ .col2_1, .col2_1_long, .col2_1_middle, .col2_1_short, .col2_1_vshort, .col2_1_mshort { padding-right: 20px; } .col2_2, .col2_2_long, .col2_2_middle, .col2_2_short, .col2_2_vshort, .col2_2_mshort { padding-left: 20px; } /* 3カラム ----------------------------------------------- */ .col3_1 { padding-right: 20px; } .col3_2 { padding-left: 10px; padding-right: 10px; } .col3_3 { padding-left: 20px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { /* 2カラム ----------------------------------------------- */ .col2_1 { } .col2_1_long { margin-top: 16vw; } .col2_1_middle { margin-top: 12vw; } .col2_1_short { margin-top: 8vw; } .col2_1_vshort { margin-top: 4vw; } .col2_1_mshort { margin-top: 3vw; } .col2_2 { } .col2_2_long { margin-top: 16vw; } .col2_2_middle { margin-top: 12vw; } .col2_2_short { margin-top: 8vw; } .col2_2_vshort { margin-top: 4vw; } .col2_2_mshort { margin-top: 3vw; } /* 3カラム ----------------------------------------------- */ .col3_1 { margin-top: 0; } .col3_2, .col3_3 { margin-top: 12vw; } } /* ================================================================================ マージンボックス ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { /* 上にマージンを空ける ----------------------------------------------- */ .top_long { margin-top: 120px; } .top_middle { margin-top: 80px; } .top_short { margin-top: 40px; } .top_vshort { margin-top: 20px; } .top_mshort { margin-top: 10px; } /* 下にマージンを空ける ----------------------------------------------- */ .bottom_long { margin-bottom: 120px; } .bottom_middle { margin-bottom: 80px; } .bottom_short { margin-bottom: 40px; } .bottom_vshort { margin-bottom: 20px; } .bottom_mshort { margin-bottom: 10px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { /* 上にマージンを空ける ----------------------------------------------- */ .top_long { margin-top: 16vw; } .top_middle { margin-top: 12vw; } .top_short { margin-top: 8vw; } .top_vshort { margin-top: 4vw; } .top_mshort { margin-top: 3vw; } /* 下にマージンを空ける ----------------------------------------------- */ .bottom_long { margin-bottom: 16vw; } .bottom_middle { margin-bottom: 12vw; } .bottom_short { margin-bottom: 8vw; } .bottom_vshort { margin-bottom: 4vw; } .bottom_mshort { margin-bottom: 3vw; } } /* ================================================================================ パディングボックス ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { /* 上にパディングを空ける ----------------------------------------------- */ .p_top_long { padding-top: 120px; } .p_top_middle { padding-top: 80px; } .p_top_short { padding-top: 40px; } .p_top_vshort { padding-top: 20px; } .p_top_mshort { padding-top: 10px; } /* 下にパディングを空ける ----------------------------------------------- */ .p_bottom_long { padding-bottom: 120px; } .p_bottom_middle { padding-bottom: 80px; } .p_bottom_short { padding-bottom: 40px; } .p_bottom_vshort { padding-bottom: 20px; } .p_bottom_mshort { padding-bottom: 10px; } /* 両方にパディングを空ける ----------------------------------------------- */ .row_long { padding-top: 120px; padding-bottom: 120px; } .row_middle { padding-top: 80px; padding-bottom: 80px; } .row_short { padding-top: 40px; padding-bottom: 40px; } .row_vshort { padding-top: 20px; padding-bottom: 20px; } .row_mshort { padding-top: 10px; padding-bottom: 10px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { /* 上にパディングを空ける ----------------------------------------------- */ .p_top_long { padding-top: 16vw; } .p_top_middle { padding-top: 12vw; } .p_top_short { padding-top: 8vw; } .p_top_vshort { padding-top: 4vw; } .p_top_mshort { padding-top: 3vw; } /* 下にパディングを空ける ----------------------------------------------- */ .p_bottom_long { padding-bottom: 16vw; } .p_bottom_middle { padding-bottom: 12vw; } .p_bottom_short { padding-bottom: 8vw; } .p_bottom_vshort { padding-bottom: 4vw; } .p_bottom_mshort { padding-bottom: 3vw; } /* 両方にパディングを空ける ----------------------------------------------- */ .row_long { padding-top: 16vw; padding-bottom: 16vw; } .row_middle { padding-top: 12vw; padding-bottom: 12vw; } .row_short { padding-top: 8vw; padding-bottom: 8vw; } .row_vshort { padding-top: 4vw; padding-bottom: 4vw; } .row_mshort { padding-top: 3vw; padding-bottom: 3vw; } /* 背景色を伸ばす ----------------------------------------------- */ .row_sp { padding-left: 4vw !important; padding-right: 4vw !important; } } /* ================================================================================ カラーボックス ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { /* カラー01 */ .row_c01 { background: url(../img/spacer.gif) center top / auto auto repeat ,#ffffff; } /* カラー02 */ .row_c02 { background: url(../img/spacer.gif) center top / auto auto repeat ,#eeeeee; } /* ボーダー囲い */ .box_border { padding: 40px; border: 4px solid #cccccc; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { /* カラー01 */ .row_c01 { background: url(../img/spacer.gif) center top / auto auto repeat ,#ffffff; padding-left: 4vw; padding-right: 4vw; } /* カラー02 */ .row_c02 { background: url(../img/spacer.gif) center top / auto auto repeat ,#eeeeee; padding-left: 4vw; padding-right: 4vw; } /* ボーダー囲い */ .box_border { padding: 4vw; border: 1vw solid #cccccc; } } /* ================================================================================ 見出し ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { /* h2見出し ----------------------------------------------- */ .h2_cate { border-bottom: 3px solid; padding: 0 0 12px 0 !important; } .h2_cate h2 { font-size: 32px; font-weight: 500; line-height: 1.4 !important; text-align: center; } /* h3見出し ----------------------------------------------- */ .h3_cate { border-bottom: 1px solid; padding: 0 0 8px 0 !important; } .h3_cate h3 { font-size: 26px; font-weight: 500; line-height: 1.4 !important; text-align: center; } /* 3カラムh3見出し ----------------------------------------------- */ .h3_col3 { border-bottom: 1px dotted; padding: 0 0 8px 0 !important; } .h3_col3 h3 { font-size: 20px; font-weight: 500; line-height: 1.4 !important; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { /* h2見出し ----------------------------------------------- */ .h2_cate { border-bottom: 3px solid; padding: 0 0 2vw 0 !important; } .h2_cate h2 { font-size: 5.5vw; font-weight: 500; line-height: 1.4 !important; text-align: center; } /* h3見出し ----------------------------------------------- */ .h3_cate { border-bottom: 1px solid; padding: 0 0 1.5vw 0 !important; } .h3_cate h3 { font-size: 4.5vw; font-weight: 500; line-height: 1.4 !important; text-align: center; } /* 3カラムh3見出し ----------------------------------------------- */ .h3_col3 { border-bottom: 1px dotted; padding: 0 0 1vw 0 !important; } .h3_col3 h3 { font-size: 4vw; font-weight: 500; line-height: 1.4 !important; } } /* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ ここから各固定ページ ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */ /* ================================================================================ 共通設定 ================================================================================ */ .title_midashi_h3 h3 { text-align: center; } .title_midashi_h3 h3:after { content: ""; display: block; background: #ea5935; } .section_box.line_box, .section_box2.line_box, .section_box3.line_box { border-bottom: solid 1px #CCC; } .top_white_txt { color: #ea5935; background: #FFF; } .txt_c { text-align: center; } /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .title_midashi_h3 h3 { font-size: 24px; font-weight:200; } .title_midashi_h3 h3:after { width: 113px; height: 5px; margin: 24px auto 50px; } .section_box { margin-bottom: 90px; } .section_box.line_box { padding-bottom: 100px; margin-bottom: 110px; } .section_box3 { margin-bottom: 50px; } .section_box3.line_box { padding-bottom: 100px; } .section_box2 { } .section_box2.line_box { padding-bottom: 50px; margin-bottom: 55px; } .container_box { margin-bottom: 40px; } .case_box { margin-bottom: 20px; } .top_white_txt { font-size: 22px; padding: 50px 0; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .title_midashi_h3 h3 { font-size: 20px; line-height: 1.2!important; font-weight:200; } .title_midashi_h3 h3:after { width: 90px; height: 4px; margin: 4% auto 6%; } .section_box { margin-bottom: 10%; } .section_box.line_box { padding-bottom: 10%; margin-bottom: 12%; } .section_box3 { margin-bottom: 6%; } .section_box3.line_box { padding-bottom: 10%; } .section_box2 { margin-bottom: 5%; } .section_box2.line_box { padding-bottom: 5%; margin-bottom: 6%; } .inner_box { padding: 0 15px; } .container_box { margin-bottom: 4%; } .case_box { margin-bottom: 3px; } .top_white_txt { padding: 0 15px; } .top_white_txt p { font-size: 18px; } .top_white_txt br { display: none; } } /* ================================================================================ ジーアールについて ================================================================================ */ .tb_company table { width: 100%; } .tb_company table td a { color: #000; } .tb_company table tr td:first-child { color: #ea5935; } /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .tb_company { width: 680px; margin-left: auto; margin-right: auto; } .tb_company table tr td { border-bottom: solid 1px #EEE; padding: 20px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .tb_company table tr td { width: 100%; display: block; text-align: center; padding: 3% 2% 1%; } .tb_company table tr td:nth-child(2) { border-bottom: solid 1px #EEE; padding: 0% 2% 3%; } } /* ================================================================================ 経営理念 ================================================================================ */ .txt_sign em { font-style: normal; display: inline-block; margin-left: 20px; } /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .txt_philosophy { font-size: 15px; } .txt_sign { text-align: right; margin-top: 140px; } .txt_sign span { font-size: 15px; } .txt_sign em { font-size: 24px; } .top_white_txt .philosophy_top_txt { width: 620px!important; margin-left: auto; margin-right: auto; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .txt_sign { text-align: center; margin-top: 10px; } .txt_sign span { font-size: 15px; } .txt_sign em { font-size: 20px; } } /* ================================================================================ WEB制作 ================================================================================ */ .bg_consulting { background: #FFF; } .web_flow_box{ color: #757575; } .web_flow_box h4 { font-weight: 300; line-height: 1; } .web_flow_box.even_box h4 { color: #67b0c4; } .web_flow_box h4 span { font-weight: 900; display: inline-block; margin-right: 10px; vertical-align: middle; } /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .bg_consulting { padding: 70px 0; } .web_flow_box h4 { font-size: 25px; } .web_flow_box h4 span { font-size: 50px; } .web_flow_box p { margin-left: 72px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .bg_consulting { padding-bottom: 8%; border-bottom: solid 1px #CCC; } .web_flow_box h4 { font-size: 20px; margin-bottom: 2%; } .web_flow_box h4 span { font-size: 30px; } .web_flow_box.section_box { padding-left: 15px; padding-right: 15px; } } /* ================================================================================ ドリームキューブ ================================================================================ */ .txt_dreamcube01 { text-align: center; color: #369; font-size: 95%; margin-top: 10px; } /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .top_white_txt .dreamcube_top_txt { width: 720px!important; margin-left: auto; margin-right: auto; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { } /* ================================================================================ 採用情報 ================================================================================ */ .recruit_txt01 p { font-size: 115%; } .bg_recruit_btn { background:url(../img/bg_recruit01.jpg) center no-repeat; background-size:cover; } .box_new_recruit { background: #f5ca35; } .box_middle_recruit { background: #2b63d5; color: #FFF!important; } .col_recruit h3 { text-align: center; border-bottom: solid 1px #000; } .col_recruit.box_middle_recruit h3 { border-bottom: solid 1px #FFF; } /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .bg_recruit_btn { padding: 210px 0; } .col_recruit { margin: 0 2%; width: 46%!important; padding: 60px 30px; box-sizing: border-box; } .col_recruit h3 { font-size: 50px; font-weight: 300; padding-bottom: 10px!important; margin-bottom: 15px!important; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .bg_recruit_btn { padding: 8vw 6vw; } .col_recruit { padding: 3vw; box-sizing: border-box; } .col_recruit h3 { font-size: 20px; font-weight: 300; padding-bottom: 10px!important; margin-bottom: 15px!important; } .box_new_recruit { margin-bottom: 3vw;; } } /* ================================================================================ 実績紹介ページ ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .works_title{ margin-top:16px; } .works_title h2{ text-align:center; font-size:26px; font-weight:200; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .works_title{ margin-top:4vw; } .works_title h2{ text-align:center; font-size:4vw; font-weight:200; } } /* ================================================================================ 制作実績ページ ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .img_jisseki img { width: 100%; height: 580px; object-fit: cover; font-family: 'object-fit: cover;'; /* IE対策 */ } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .img_jisseki img { width: 100%; height: 50vw; object-fit: cover; font-family: 'object-fit: cover;'; /* IE対策 */ } } /* ================================================================================ 〇〇ページ ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .j_midashi h3 { position: relative; padding-bottom: .5em; border-bottom: solid 3px #d5d5d5; font-size: 24px; font-weight: normal; padding-bottom: 9px !important; margin-bottom: 8px !important; margin-top: 18px !important; } .j_midashi2 h3 { position: relative; padding-bottom: .5em; border-bottom: solid 1px #DCDCDC; font-size: 18px; font-weight: normal; padding-bottom: 9px !important; margin-bottom: 8px !important; } .j_midashi h3:after { position: absolute; bottom: -3px; content: " "; display: block; width: 20%; border-bottom: solid 3px #ea5935; } .j_text02{ margin-top:20px; } .indent{ padding-left: 20px; } .btm20{ margin-bottom:20px; } .j_contact{ margin-top: 78px; } .p_none{ display:none; } .m_60{ margin-bottom:60px!important; } .dx_tbl tbody tr td { padding: 3px 10px; border: #464646 solid 1px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .j_midashi h3 { position: relative; padding-bottom: .5em; border-bottom: solid 1px #ffe6e6; font-size: 6vw; font-weight: normal; padding-bottom: 4vw !important; margin-bottom: 3vw !important; margin-top: 5vw !important; } .j_midashi2 h3 { position: relative; padding-bottom: .5em; border-bottom: solid 1px #DCDCDC; font-size: 4vw; font-weight: normal; padding-bottom: 3vw !important; margin-bottom: 1vw !important; } .j_midashi h3:after { position: absolute; bottom: -3px; content: " "; display: block; width: 20%; border-bottom: solid 3px #ea5935; } .j_text02{ margin-top:20px; } .indent{ padding-left: 20px; } .btm20{ margin-bottom:20px; } .j_contact{ margin-top: 5vw; } .m_60{ margin-bottom: 12vw !important; } .dx_tbl tbody tr td { padding: 3px 10px; border: #464646 solid 1px; } } /* ================================================================================ 動画 ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .doga_texts{ padding: 20px; width: 703px !important; margin: 0 auto; } .m_40{ margin-bottom:40px!important; } .doga_matome_text{ margin: 26px 0 0 0; padding: 34px; background-color: #E8E8E8; } .doga_merit{ border:1px solid #DCDCDC; padding:30px; height: 410px; } .w900{ width: 772px !important; margin: 0 auto; } .d_kotae{ padding:10px 0; font-size:18px; } .doga_pic img{ width:700px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .doga_texts{ padding: 20px; margin: 0 auto; } .m_40{ margin-bottom: 3vw !important; } .doga_matome_text{ margin: 26px 0 0 0; padding: 34px; background-color: #E8E8E8; } .doga_merit{ border:1px solid #DCDCDC; padding:30px; } .w900{ margin: 0 auto; } .d_kotae{ padding:10px 0; font-size:3.4vw; } .top40{ margin-top: 8vw !important; } .top20{ margin-top: 2vw !important; } .j_midashi h3 { position: relative; padding-bottom: .5em; border-bottom:solid 1px #aaa; font-size: 3.8vw; font-weight: normal; padding-bottom: 4vw !important; margin-bottom: 3vw !important; margin-top: 5vw !important; } } /* ================================================================================ ビフォー ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .before_midashi{ border-bottom: 2px solid; padding: 0 0 9px 0 !important; margin-bottom: 33px; } .before_midashi h3{ font-size:30px; font-weight:normal; } .before_pic{ border:1px solid #DCDCDC; margin: 0 3px; } .before_icon h2{ font-size:23px; color:#DCDCDC; padding-bottom: 18px; } .before_q{ margin-top:80px; } .before_komoku h3{ font-size: 28px; color: #424242; font-weight: normal; text-align: center; border-bottom: 2px dotted #999; padding-bottom: 28px; } .before_komoku2 h3{ font-size: 28px; color: #424242; font-weight: normal; text-align: left; border-bottom: 2px dotted #999; padding-bottom: 28px; } .before_text{ margin-top: 18px; font-size: 18px; } .before_link{ color: #1ca9e3; font-size: 16px; display: block; margin-top: 10px; } .before_link:hover{ opacity: 1; color: #1ca9e3; } .before_br{ display:none; } .sun_re_pic{ object-fit: cover; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .before_midashi{ border-bottom: 2px solid; padding: 0 0 9px 0 !important; margin-bottom: 33px; } .before_midashi h3{ font-size:30px; font-weight:normal; } .before_pic{ border:1px solid #DCDCDC; margin: 0 3px; } .before_icon h2{ font-size:23px; color:#DCDCDC; padding-bottom: 18px; } .before_q{ margin-top:80px; } .before_komoku h3{ font-size: 28px; color: #424242; font-weight: normal; text-align: center; border-bottom: 2px dotted #999; padding-bottom: 28px; } .before_komoku2 h3{ font-size: 28px; color: #424242; font-weight: normal; text-align: left; border-bottom: 2px dotted #999; padding-bottom: 28px; } .before_text{ margin-top: 18px; font-size: 18px; } .before_link{ color: #1ca9e3; font-size: 16px; display: block; margin-top: 10px; } .before_link:hover{ opacity: 1; color: #1ca9e3; } .before_br{ display:block; } } /* ================================================================================ 成田マネブログ ================================================================================ */ /* PC設定 ----------------------------------------------- */ @media (min-width: 768px) { .narita{ background-color: #313131; font-size: 13px; padding: 10px 23px; } .narita_icon span{ position: relative; transform: translateY(16px); -webkit-transform: translateY(16px); -ms-transform: translateY(16px); background-color: #1c82ee; color: #FFF; padding: 10px 12px; z-index: 1; display: inline-block; font-size: 13px; } .naritamoji{ color: #fff; font-size: 16px; } .category-webblog_list .blog_wrap2 > ul > li { margin-bottom: 60px; padding: 48px 048px; border: 1px solid #B7B7B7; background: #FFF; } .category-webblog_list .voice_title_link { font-size: 30px; border-bottom: 3px solid #DCDCDC; padding-bottom: 5px; margin-bottom: 34px; margin-top: 22px; } } /* SP設定 ----------------------------------------------- */ @media (max-width: 767px) { .narita{ background-color: #313131; font-size: 13px; padding: 10px 23px; } .narita_icon span{ position: relative; transform: translateY(16px); -webkit-transform: translateY(16px); -ms-transform: translateY(16px); background-color: #1c82ee; color: #FFF; padding: 10px 12px; z-index: 1; display: inline-block; font-size: 13px; } .naritamoji{ color: #fff; font-size: 16px; } .category-webblog_list .blog_wrap2 > ul > li { margin-bottom: 60px; padding: 5vw 5vw; border: 1px solid #B7B7B7; background: #FFF; } .category-webblog_list .voice_title_link { font-size: 5vw; border-bottom: 3px solid #DCDCDC; padding-bottom: 2vw; margin-bottom: 6vw; margin-top: 5vw; } }