@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; } } /* add 2025 start */ .cont_main { position: relative; padding-top: 0; } .cont_main img { line-height: 1; vertical-align: bottom; } .cont_main_bg { position: relative; top: 0; left: 0; width: 100%; z-index: 1; } .cont_main_txt{ position: absolute; top: 0; left: 50%; transform: translateX(-50%); z-index: 2; color: #FFFFFF; width: 64%; margin-top: 16%; } .cont_main_txt .cont_main_txt_copy{ text-align: center; font-size: max(1.2vw,10px); letter-spacing: 0.2em; width: auto; margin-top: 3%; line-height: 200%; } @media only screen and (max-width: 767px) { .cont_main_txt{ width: 100%; margin-top: 66%; } .cont_main_txt .cont_main_txt_copy{ display: block; text-align: left; width: 83%; margin: 6% auto; font-size: min(2.8vw,14px); line-height: 215%; } } .cont_solution{ position: relative; padding-top: 50px; } .cont_solution_bg{ position: absolute; top: 0; left: 0; z-index: 0; width: 100%; height: calc(100% - 70px); background: #FFFFFF; } @media only screen and (max-width: 767px) { .cont_solution{ padding-top: 10%; } .cont_solution_bg{ height: calc(100% - 6%); } } .cont_solution_bg img{ width: 100%; height: 100%; object-position: center top; object-fit: cover; } .cont_solution_inner{ position: relative; z-index: 1; text-align: center; width: 100%; max-width: 900px; margin: 0 auto; } .cont_solution .cont_solution_ttl_l{ display: block; font-size: 28px; line-height: 140%; color: #0d2ea0; } @media only screen and (max-width: 767px) { .cont_solution .cont_solution_ttl_l{ font-size: 18px; display: block; width: 80%; margin-left: auto; margin-right: auto; } } .cont_main_txt_copy_word, .cont_solution_word{ display: inline-block; } .cont_solution_img{ margin: 45px auto 70px; } .cont_solution_bnr{ width: 100%; max-width: 600px; margin: 0 auto; } @media only screen and (max-width: 767px) { .cont_solution_img{ margin: 8% auto 12%; } .cont_solution_bnr{ width: 80%; } } .cont_02{ background: #FFFFFF; padding-top: 95px; } @media only screen and (max-width: 767px) { .cont_02_business_inner { padding-bottom: 36px; } } @media (min-width: 768px) { .product_imgbox { min-height: 125px; display: flex; align-items: center; } } /* add 2025 end */