@charset "utf-8"; /* common */ .all_wrapper h1, .all_wrapper h2, .all_wrapper h3, .all_wrapper h4, .all_wrapper h5, .all_wrapper h6, .all_wrapper p { margin: 0; } .all_wrapper ul { margin: 0; padding: 0; } @media only screen and (min-width: 768px) { .all_wrapper .sp_only { display: none!important; } } @media only screen and (max-width: 767px) { .all_wrapper .pc_only { display: none!important; } } .all_wrapper { font-feature-settings: "palt"; font-family: "Yu Gothic", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, "MS Pゴシック", "MS PGothic", sans-serif; overflow: hidden; } .cont_mv { text-align: center; position: relative; max-width: 1440px; margin: auto; } @media only screen and (min-width: 767px) { .cont_mv { height: 640px; } .all_wrapper .cont_mv_img { position: absolute; top: 0; left: 50%; margin-left: -720px; } } .cont_inner { max-width: 1052px; margin: auto; padding-left: 20px; padding-right: 20px; } /* cont_01 */ .cont_01 { padding-top: 75px; padding-bottom: 80px; } .cont_01_img { padding-left: 0; padding-right: 0; } .cont_01_ttl { text-align: center; font-size: 28px; line-height: 1.4; } .cont_01_ttl_word { display: inline-block; } .cont_01_ttl_l { font-style: italic; display: block; font-size: 64px; color: #0d2ea1; } .all_wrapper .cont_01_txt { text-align: center; width: 420px; margin: 17px auto 0; font-size: 14px; line-height: 1.75; } .cont_01_txt_word { display: inline-block; } .cont_01_img { margin-top: 35px; } @media only screen and (max-width: 767px) { .cont_01 { padding-top: 40px; padding-bottom: 40px; } h2.cont_01_ttl { font-size: 20px; width: 120%; margin-left: -10%; } .cont_01_ttl_l { line-height: 1.2; margin-top: 3px; font-size: 32px; } .all_wrapper .cont_01_txt { width: 90%; margin-top: 9px; } .cont_01_img { margin-top: 25px; } } /* cont_02 */ .cont_02 { padding-top: 72px; padding-bottom: 80px; background-color: #f2f2f2; } .cont_02_ttl { font-size: 28px; font-weight: 700; text-align: center; } .cont_02_ttl > i { color: #0d2ea1; } .cont_02_business { margin-top: 28px; } .cont_02_business + .cont_02_business { margin-top: 56px; } .all_wrapper .cont_02_business_ttl { color: #fff; font-size: 24px; padding: 14px 40px; line-height: 1; } .cont_02_business:nth-child(even) .cont_02_business_ttl { background-color: #2dbcef; } .cont_02_business:nth-child(even) .cont_02_business_inner { background:#d5f2fc url(/-/media/cojp/product/business/img/bg_even); } .cont_02_business:nth-child(even) .product_btn { background-color: #2dbcef; } .cont_02_business:nth-child(odd) .cont_02_business_ttl { background-color: #0d2ea1; } .cont_02_business:nth-child(odd) .cont_02_business_inner { background:#d5f2fc url(/-/media/cojp/product/business/img/bg_odd); } .cont_02_business:nth-child(odd) .product_btn { background-color: #0d2ea1; } .cont_02_business_inner { padding: 8px 40px 40px; } .cont_02_business_inner_bottom { padding-bottom: 60px; } .all_wrapper .cont_02_product_list { list-style-type: none; display: flex; flex-wrap: wrap; justify-content: space-between; } .cont_02_product_listitem { width: 48.355%; margin-top: 32px; display: flex; justify-content: space-between; flex-direction: column; position: relative; } .product_item_box { background-color: #fff; display: flex; align-items: center; flex-direction: column; height: 100%; padding: 12px 32px 26px; } .product_txtbox { width: 100%; margin-top: 17px; } .all_wrapper .product_txt_ttl { font-size: 20px; font-weight: 700; line-height: 1.4; margin-right: -15px; } p.product_txt { font-size: 14px; line-height: 1.75; min-height: 5em; margin-top: 11px; } .product_txt_bold { font-weight: 700; } .product_txt_small { font-size: 12px; line-height: 1.5; display: block; margin-top: 10px; } .product_btn { display: block; color: #fff; height: 44px; line-height: 44px; text-align: center; font-weight: 700; box-sizing: border-box; position: relative; } p.product_btn_note { font-size: 12px; position: absolute; left: 0; bottom: -24px; } /**/ .product_btn[target="_blank"] .product_btn_icon { background-image: url(/-/media/cojp/product/business/img/icon_tab); background-repeat: no-repeat; background-size: 14px auto; } .product_btn_icon { display: inline-block; width: 14px; height: 14px; vertical-align: middle; margin-left: 6px; margin-top: -3px; background-position: center center; } .product_imgbox { box-sizing: border-box; } .product_cat_ttl { background-color: #666; color: #fff; padding: 8px 32px; font-size: 18px; font-weight: 700; line-height: 1; } .product_index_link { font-weight: 700; background-color: #333; color: #fff; display: block; width: 324px; margin: 40px auto 0; text-align: center; font-size: 14px; line-height: 1; height: 40px; line-height: 40px; box-sizing: border-box; } .cont_02_bnr_wrap { text-align: center; padding: 80px 20px; } .cont_02_bnr { display: block; max-width: 670px; margin: auto; } .cont_02_bnr + .cont_02_bnr { margin-top: 40px; } @media only screen and (max-width: 767px) { .cont_02 { padding-top: 33px; padding-bottom: 40px; } .cont_02_ttl { font-size: 20px; } .all_wrapper .cont_02_business_ttl { font-size: 16px; padding: 8px 12px; } .cont_02_business + .cont_02_business { margin-top: 32px; } .cont_02_business:nth-child(even) .cont_02_business_inner, .cont_02_business:nth-child(odd) .cont_02_business_inner { background-size: 1px auto; } .cont_02_business_inner { padding: 0 16px 16px; } .cont_02_business_inner_bottom { padding-bottom: 40px; } .cont_02_product_listitem { width: 100%; margin-top: 20px; } .cont_02_product_listitem_group + .cont_02_product_listitem { margin-top: 34px; } .product_item_box { padding: 20px 16px; } .product_cat_ttl { padding: 5px 20px; font-size: 16px; } .all_wrapper .product_txt_ttl { font-size: 16px; line-height: 1.4375; } p.product_txt { font-size: 12px; line-height: 1.5; } .product_index_link { width: 100%; max-width: 240px; margin-top: 20px; } .product_txt_small { font-size: 10px; } p.product_btn_note { text-align: center; font-size: 10px; bottom: -20px; } .product_btn { height: auto; line-height: 1.2; padding: 12px 0; } .product_btn[target="_blank"] { background-position: right 12px center; } .cont_02_bnr_wrap { padding-top: 40px; padding-bottom: 40px; } }