.back-link.company a { min-width: 125px; } /*------------------------------------------------------ index ------------------------------------------------------*/ #index {} #index .page-title { line-height: 1.4; font-weight: bold;} #index .page-title p { color: #CEDE68; margin-bottom: 10px;} #index .page-title h3 { letter-spacing: 1.2px;} #index #about-01 {} #index #about-01 .l_col-2 {} #index #about-01 .l_col-2 > figure {} #index #about-01 .l_col-2 > figure img {} #index #about-01 .l_col-2 > div {} #index #about-01 .l_col-2 > div figure {} #index #about-01 .l_col-2 > div figure img { max-width: 560px; width: 100%; height: auto;} #index #about-01 .l_col-2:nth-child(odd) {} #index #about-01 .l_col-2:nth-child(odd) > figure {} #index #about-01 .l_col-2:nth-child(odd) > figure img {} #index #about-01 .l_col-2:nth-child(odd) > div {} #index #about-01 .l_col-2:nth-child(odd) > div figure {} #index #about-01 .l_col-2:nth-child(odd) > div figure img {} #index #page-visual.type-c .l_col-img figure:last-child { max-width: 780px;} @media (min-width: 768px) { #index {} #index .page-title { position: relative; margin-bottom: 70px;} #index .page-title p { display: inline-block; background-color: #fff; padding-right: 18px; font-size: 4rem; } #index .page-title p::before { content: ""; position: absolute; right: 0; top: 26px; width: 100%; height: 1px; background-color: #CEDE68; z-index: -1;} #index .page-title h3 { font-size: 2.4rem; } #index #about-01 { margin-bottom: 180px;} #index #about-01 .l_col-2 { position: relative; max-width: 1600px; margin-left: auto; margin-right: auto; } #index #about-01 .l_col-2 > figure { width: calc(50% - 20px); margin-bottom: 0; /*padding-left: 50px;*/ padding-right: 60px; } #index #about-01 .l_col-2 > figure img { border-radius: 80px 80px 80px 0;} #index #about-01 .l_col-2 > div { width: calc(50% - 20px); } #index #about-01 .l_col-2 > div > * { max-width: 560px;} #index #about-01 .l_col-2 > div figure {} #index #about-01 .l_col-2 > div figure img {} #index #about-01 .l_col-2:nth-child(odd) { flex-direction: row-reverse; } #index #about-01 .l_col-2:nth-child(odd) > figure { padding-right: 0; padding-left: 60px;} #index #about-01 .l_col-2:nth-child(odd) > figure img { border-radius: 80px 0 80px 80px; } #index #about-01 .l_col-2:nth-child(odd) > div {} #index #about-01 .l_col-2:nth-child(odd) > div * { margin-left: auto; } #index #about-01 .l_col-2:nth-child(odd) > div figure {} #index #about-01 .l_col-2:nth-child(odd) > div figure img {} } @media screen and (min-width:768px) and ( max-width:1210px) { #index #about-01 .l_col-2 > figure { padding-right: 20px;} #index #about-01 .l_col-2 > div { padding-right: 20px;} #index #about-01 .l_col-2:nth-child(odd) > figure { padding-right: 0; padding-left: 20px;} #index #about-01 .l_col-2:nth-child(odd) > div { padding-right: 0; padding-left: 20px;} } @media (max-width: 767px) { #index {} #index .page-title { margin-bottom: 50px; text-align: center; } #index .page-title p { font-size: 2.8rem; line-height: 1.2;} #index .page-title h3 { font-size: 2rem; } #index #about-01 {} #index #about-01 .l_col-2 {} #index #about-01 .l_col-2 > figure { margin-bottom: 50px;} #index #about-01 .l_col-2 > figure img { border-radius: 0 60px 60px 60px;} #index #about-01 .l_col-2 > div { margin-bottom: 0; margin-left: 15px; margin-right: 15px;} #index #about-01 .l_col-2 > div figure {} #index #about-01 .l_col-2 > div figure img {} #index #about-01 .l_col-2:nth-child(odd) {} #index #about-01 .l_col-2:nth-child(odd) > figure {} #index #about-01 .l_col-2:nth-child(odd) > figure img {} #index #about-01 .l_col-2:nth-child(odd) > div {} #index #about-01 .l_col-2:nth-child(odd) > div figure {} #index #about-01 .l_col-2:nth-child(odd) > div figure img {} } /*------------------------------------------------------ [index] page-link ------------------------------------------------------*/ #index #page-link { background-color: #CEDE68; padding-top: 50px; padding-bottom: 50px;} #index #page-link .l_col-3 {} #index #page-link .l_col-3 > div {} #index #page-link a { color: #173C48; text-decoration: none;} #index #page-link a div { background: #FFD900; line-height: 1.4; font-weight: bold; text-align: center; } #index #page-link a .english { font-size: 2.8rem; margin-bottom: 5px; } #index #page-link a .name { font-size: 2rem; letter-spacing: 1px; background: url(/common/images/icon_arrow_black.svg) no-repeat right top / 34px 34px; display: inline-block; min-height: 34px; padding-right: 42px; padding-top: 3px;} #index #page-link a figure { margin-bottom: 0;} #index #page-link a figure img {} @media (min-width: 768px) { #index #page-link { margin-bottom: 265px;} #index #page-link .l_col-3 {} #index #page-link .l_col-3 > div {} #index #page-link a {} #index #page-link a div { height: 190px; padding-top: 60px; border-radius: 0 80px 80px 80px;} #index #page-link a .english {} #index #page-link a .name {} #index #page-link a figure {} #index #page-link a figure img { border-radius: 80px 80px 80px 0; } #index #page-link .l_col-3 > div:nth-child(2) a { display: flex; flex-direction: column-reverse; } #index #page-link .l_col-3 > div:nth-child(2) a figure img { border-radius: 0 80px 80px 80px;} #index #page-link .l_col-3 > div:nth-child(2) a div { border-radius: 80px 80px 0 80px;} #index #page-link .l_col-3 > div:nth-child(3) a div { border-radius: 80px 0 80px 80px;} } @media (max-width: 767px) { #index #page-link {} #index #page-link .l_col-3 {} #index #page-link .l_col-3 > div { border-radius: 0 60px 60px 60px; overflow: hidden; margin-bottom: 50px;} #index #page-link a { display: flex; flex-direction: column-reverse; } #index #page-link a div { height: 100px; padding-top: 10px;} #index #page-link a .english {} #index #page-link a .name {} #index #page-link a figure { height: 260px;} #index #page-link a figure img { object-fit: cover; width: 100%; height: 100%; } #index #page-link .l_col-3 > div:nth-child(2) { border-radius: 60px 0 60px 60px;} #index #page-link .l_col-3 > div:last-child { margin-bottom: 0;} } /*------------------------------------------------------ [index] about-02 ------------------------------------------------------*/ #index #about-02 {} #index #about-02 .l_col-2 {} #index #about-02 .l_col-2 > .l_col-img { align-items: baseline;} #index #about-02 .l_col-2 > .l_col-img figure { width: 40%; margin-bottom: 0;} #index #about-02 .l_col-2 > .l_col-img figure:last-child { width: 60%;} #index #about-02 .l_col-2 > .l_col-img figure img {} #index #about-02 .l_col-2 > div:first-child {} @media (min-width: 768px) { #index #about-02 {} #index #about-02 .l_col-2 { width: 130%; max-width: 1500px; left: -15%; position: relative; } #index #about-02 .l_col-2 > .l_col-img { width: calc(50% - 20px); margin-bottom: 0; padding-left: 60px; position: relative; top: -155px; } #index #about-02 .l_col-2 > .l_col-img figure { width: 260px;} #index #about-02 .l_col-2 > .l_col-img figure img { border-radius: 80px 0 80px 80px;} #index #about-02 .l_col-2 > .l_col-img figure:last-child { width: 410px; position: relative; top: -80px;} #index #about-02 .l_col-2 > div:first-child { width: calc(50% - 20px); padding-left: 175px; } } @media screen and (min-width:768px) and ( max-width:1210px) { #index #about-02 .l_col-2 { width: 100%; left: 0;} #index #about-02 .l_col-2 > div:first-child { padding-left: 0;} #index #about-02 .l_col-2 > .l_col-img { top: 0; padding-left: 20px; } #index #about-02 .l_col-2 > .l_col-img figure { width: 40%;} #index #about-02 .l_col-2 > .l_col-img figure:last-child { width: 60%; } } @media (max-width: 767px) { #index #about-02 .page-title { margin-bottom: 80px;} #index #about-02 {} #index #about-02 .l_col-2 { flex-direction: column-reverse; } #index #about-02 .l_col-2 > .l_col-img { margin-bottom: 45px; position: relative; width: calc(100% + 30px); left: -15px; } #index #about-02 .l_col-2 > .l_col-img figure { margin-bottom: 0;} #index #about-02 .l_col-2 > .l_col-img figure img { border-radius: 60px 0 60px 60px; } #index #about-02 .l_col-2 > .l_col-img figure:last-child { position: relative; top: -50px;} #index #about-02 .l_col-2 > div:first-child { margin-bottom: 0;} } /*------------------------------------------------------ [index] about-03 ------------------------------------------------------*/ #index #about-03 {} #index #about-03 .page-title {} #index #about-03 .page-title p {} #index #about-03 .page-title h3 {} #index #about-03 .l_col-2-r {} #index #about-03 .l_col-2-r > figure {} #index #about-03 .l_col-2-r > figure img { border-radius: 0 80px 80px 80px;} #index #about-03 .l_col-2-r > div {} #index #about-03 .l_col-2-r > div .text {} #index #about-03 .l_col-2-r > div .text p { font-weight: bold;} @media (min-width: 768px) { #index #about-03 {} #index #about-03 .page-title { text-align: right; margin-bottom: 25px;} #index #about-03 .page-title p { padding-right: 0; padding-left: 18px;} #index #about-03 .page-title h3 {} #index #about-03 .l_col-2-r {} #index #about-03 .l_col-2-r > figure { width: 260px; position: relative; top: -150px;} #index #about-03 .l_col-2-r > figure img {} #index #about-03 .l_col-2-r > div { width: calc(100% - (260px + 40px));} #index #about-03 .l_col-2-r > div .text {} #index #about-03 .l_col-2-r > div .text p {} } @media screen and (min-width:768px) and ( max-width:1210px) { #index #about-03 .l_col-2-r > figure { top: 0;} } @media (max-width: 767px) { #index #about-03 {} #index #about-03 .page-title {} #index #about-03 .page-title p {} #index #about-03 .page-title h3 {} #index #about-03 .l_col-2-r {} #index #about-03 .l_col-2-r > figure { width: 70%; margin-left: auto; margin-right: auto; margin-bottom: 50px;} #index #about-03 .l_col-2-r > figure img {} #index #about-03 .l_col-2-r > div {} #index #about-03 .l_col-2-r > div .text {} #index #about-03 .l_col-2-r > div .text p {} } /*------------------------------------------------------ [outline] ------------------------------------------------------*/ #outline .table-a td .list-a.l_col-2 {} #outline .table-a td .list-a.l_col-2 li {} #outline .table-a .table-a th { font-weight: normal;} #outline .table-a .table-a tr:last-child { border-bottom: none;} @media (min-width: 768px) { #outline .table-a td .list-a li { font-size: 1.6rem;} #outline .table-a td .list-a.l_col-2 {} #outline .table-a td .list-a.l_col-2 li {} #outline .table-a td .list-a.l_col-2 > *:nth-child(n+3) { margin-top: 5px;} } @media (max-width: 767px) { #outline .table-a td .list-a.l_col-2 {} #outline .table-a td .list-a.l_col-2 li { margin-bottom: 10px;} } /*------------------------------------------------------ [greeting] ------------------------------------------------------*/ @media (min-width: 768px) { /* .title-a { margin-bottom: 80px;} */ } @media (max-width: 767px) { } /*------------------------------------------------------ [greeting] greeting01 ------------------------------------------------------*/ #greeting #greeting01 { background-color: #F5F8E3; padding-top: 50px; padding-bottom: 50px;} #greeting #greeting01 .l_col-2 {} #greeting #greeting01 .l_col-2 figure { position: relative; text-align: right;} #greeting #greeting01 .l_col-2 figure::before { content: ""; background-color: #CEDE68; position: absolute; border-radius: 80px; left: 0; bottom: -15px;} #greeting #greeting01 .l_col-2 figure img { position: relative; width: calc(100% - 60px); max-width: 400px;} #greeting #greeting01 .l_col-2 figure figcaption { color: #173C48; font-size: 1.8rem; font-weight: bold; margin: 0; position: relative; text-align: left; padding-top: 10px; line-height: 1.5; padding-left: 70px; } #greeting #greeting01 .l_col-2 figure figcaption span {} #greeting #greeting01 .l_col-2 figure p { color: #fff; font-weight: bold; line-height: 1.4; transform: rotate(90deg); position: absolute; top: 58%;} #greeting #greeting01 .l_col-2 > div {} #greeting #greeting01 .l_col-2 .title-b {} #greeting #greeting01 .l_col-2 .text {} #greeting #greeting01 .l_col-2 .text p { } #greeting #greeting01 .l_col-2:not(:last-child) { margin-bottom: 80px;} #greeting #greeting01 .long-title {} #greeting #greeting01 .long-title.l_col-2 figure p {} @media (min-width: 768px) { #greeting #greeting01 { border-radius: 80px; padding-bottom: 80px; margin-bottom: 130px;} #greeting #greeting01 .l_col-2 {} #greeting #greeting01 .l_col-2 > .img { width: calc(44% - 50px); } #greeting #greeting01 .l_col-2 figure {} #greeting #greeting01 .l_col-2 figure::before { width: calc(100% - 50px); height: calc(100% - 65px); } #greeting #greeting01 .l_col-2 figure img { border-radius: 80px 0 80px 80px; } #greeting #greeting01 .l_col-2 figure figcaption {} #greeting #greeting01 .l_col-2 figure figcaption span { font-size: 3.2rem; } #greeting #greeting01 .l_col-2 figure p { font-size: 3.2rem; left: -68px; } #greeting #greeting01 .l_col-2 > div { width: calc(56% - 50px);} #greeting #greeting01 .l_col-2 .title-b {} #greeting #greeting01 .l_col-2 .text {} #greeting #greeting01 .l_col-2 .text p {} #greeting #greeting01 .long-title.l_col-2 figure p { left: -115px;} #greeting #greeting01 .long-title.l_col-2 figcaption {} } @media screen and (min-width:768px) and ( max-width:1100px) { #greeting #greeting01 .long-title.l_col-2 figure figcaption { font-size: 1.4rem;} #greeting #greeting01 .long-title.l_col-2 figure figcaption span { font-size: 2.8rem;} #greeting #greeting01 .long-title.l_col-2 figure p { font-size: 2.8rem; left: -98px;} } @media screen and (min-width:768px) and ( max-width:1000px) { #greeting #greeting01 .l_col-2 > .img { width: calc(44% - 20px); } #greeting #greeting01 .l_col-2 > div { width: calc(56% - 20px);} #greeting #greeting01 .l_col-2 figure figcaption { font-size: 1.6rem;} #greeting #greeting01 .l_col-2 figure figcaption span { font-size: 2.8rem;} } @media (max-width: 767px) { #greeting #greeting01 {} #greeting #greeting01 .l_col-2 {} #greeting #greeting01 .l_col-2 > .img { max-width: 460px; margin-left: auto; margin-right: auto; margin-bottom: 50px;} #greeting #greeting01 .l_col-2 figure {} #greeting #greeting01 .l_col-2 figure::before { width: calc(100% - 40px); height: calc(100% - 55px); } #greeting #greeting01 .l_col-2 figure img { border-radius: 60px 0 60px 60px; } #greeting #greeting01 .l_col-2 figure figcaption {} #greeting #greeting01 .l_col-2 figure figcaption span { font-size: 2.6rem;} #greeting #greeting01 .l_col-2 figure p { font-size: 2.4rem; left: -43px; } #greeting #greeting01 .l_col-2 > div { width: 100%;} #greeting #greeting01 .l_col-2 .title-b {} #greeting #greeting01 .l_col-2 .text {} #greeting #greeting01 .l_col-2 .text p {} #greeting #greeting01 .long-title.l_col-2 figure p { left: -79px;} #greeting #greeting01 .long-title.l_col-2 figcaption { font-size: 1.5rem;} } /*------------------------------------------------------ [greeting] staff ------------------------------------------------------*/ #greeting #staff {} #greeting #staff .title-a p::first-letter { font-size: 100%;} #greeting .staff-inner { line-height: 1.4;} #greeting .staff-inner .post { font-size: 1.6rem; font-weight: bold; margin-bottom: 8px;} #greeting .staff-inner .name { font-weight: bold; letter-spacing: 1.8px; border-bottom: 1px solid #CEDE68; padding-bottom: 15px; margin-bottom: 20px;} #greeting .staff-inner .name span { color: #C7C7C7; font-weight: bold; letter-spacing: 1.4px; } #greeting .staff-inner figure {} #greeting .staff-inner figure img { max-width: 260px; height: auto;} #greeting .staff-inner .qa {} #greeting .staff-inner .qa > div {} #greeting .staff-inner .qa dt { font-size: 1.6rem; font-weight: bold; padding-left: 39px; text-indent: -39px; margin-bottom: 10px;} #greeting .staff-inner .qa dt::before { content: "Q"; display: inline-block; width: 34px; height: 34px; border-radius: 50%; background-color: #CEDE68; color: #fff; font-family: "Poppins", sans-serif; font-size: 2rem; text-align: center; line-height: 34px; text-indent: 0; margin-right: 5px;} #greeting .staff-inner .qa dd { font-size: 1.6rem; margin-bottom: 30px;} #greeting .staff-inner .l_col-2-r {} #greeting .staff-inner .l_col-2-r > div:first-child { background-color: #CEDE68; } #greeting .staff-inner .l_col-2-r > div:first-child p:first-child { font-size: 2.8rem; font-weight: bold; margin-bottom: 10px;} #greeting .staff-inner .l_col-2-r > div:first-child p:last-child { font-size: 2rem; font-weight: bold;} #greeting .staff-inner .l_col-2-r > .text {} #greeting .staff-inner .l_col-2-r > .text p {} @media (min-width: 768px) { #greeting .staff-inner { position: relative; margin-bottom: 160px;} #greeting .staff-inner .post {} #greeting .staff-inner .name { font-size: 3.2rem; } #greeting .staff-inner .name span { margin-left: 15px; font-size: 2.8rem; } #greeting .staff-inner figure { position: absolute; right: 50px; top: 5px;} #greeting .staff-inner figure img { /*border-radius: 80px 0 80px 80px;*/} #greeting .staff-inner .qa { margin-bottom: 70px; padding-right: 340px;} #greeting .staff-inner .qa > div {} #greeting .staff-inner .qa dt {} #greeting .staff-inner .qa dd {} #greeting .staff-inner .l_col-2-r {} #greeting .staff-inner .l_col-2-r > div:first-child { border-radius: 0 80px 80px 80px; padding: 30px 10px 10px 38px; width: calc(42% - 25px); max-width: 480px; min-height: 180px; } #greeting .staff-inner .l_col-2-r > div:first-child p:first-child {} #greeting .staff-inner .l_col-2-r > div:first-child p:last-child {} #greeting .staff-inner .l_col-2-r > .text { width: calc(58% - 25px);} #greeting .staff-inner .l_col-2-r > .text p {} } @media screen and (min-width:768px) and ( max-width:1210px) { #greeting .staff-inner figure { right: 20px;} } @media (max-width: 767px) { #greeting .staff-inner { margin-bottom: 100px;} #greeting .staff-inner .post {} #greeting .staff-inner .name { font-size: 2.8rem; } #greeting .staff-inner .name span { display: block; font-size: 2rem;} #greeting .staff-inner figure { margin-bottom: 30px;} #greeting .staff-inner figure img { /*border-radius: 60px 0 60px 60px;*/} #greeting .staff-inner .qa { margin-bottom: 50px;} #greeting .staff-inner .qa > div {} #greeting .staff-inner .qa dt {} #greeting .staff-inner .qa dd {} #greeting .staff-inner .l_col-2-r {} #greeting .staff-inner .l_col-2-r > div:first-child { border-radius: 0 60px 60px 60px; padding: 30px 20px 50px; } #greeting .staff-inner .l_col-2-r > div:first-child p:first-child {} #greeting .staff-inner .l_col-2-r > div:first-child p:last-child {} #greeting .staff-inner .l_col-2-r > .text {} #greeting .staff-inner .l_col-2-r > .text p {} } /*------------------------------------------------------ [commitment] commitment01 ------------------------------------------------------*/ #commitment #commitment01 {} #commitment #commitment01 .title-b {} #commitment #commitment01 > .l_col-2:not(.container) {} #commitment #commitment01 > .l_col-2:not(.container) .text {} #commitment #commitment01 > .l_col-2:not(.container) .text p {} #commitment #commitment01 > .l_col-2:not(.container) figure {} #commitment #commitment01 > .l_col-2:not(.container) figure img { width: 100%;} #commitment #commitment01 .l_col-2.container {} #commitment #commitment01 .l_col-2.container .l_col-2 {} #commitment #commitment01 .l_col-2.container .l_col-2 figure { margin-bottom: 0;} #commitment #commitment01 .l_col-2.container .l_col-2 figure img { width: 100%; max-width: 260px;} #commitment #commitment01 .l_col-2.container .text {} #commitment #commitment01 .l_col-2.container .text p {} @media (min-width: 768px) { #commitment #commitment01 { margin-bottom: 65px;} #commitment #commitment01 .title-b { position: relative; top: 70px;} #commitment #commitment01 > .l_col-2:not(.container) { position: relative; max-width: 1600px; margin-left: auto; margin-right: auto; margin-bottom: 55px;} #commitment #commitment01 > .l_col-2:not(.container) .text { width: calc(50% - 20px); padding-top: 70px; } #commitment #commitment01 > .l_col-2:not(.container) .text p { max-width: 560px; margin-left: auto; margin-right: 0; } #commitment #commitment01 > .l_col-2:not(.container) figure { width: calc(50% - 20px); margin-bottom: 0; padding-left: 60px; text-align: left; } #commitment #commitment01 > .l_col-2:not(.container) figure img { border-radius: 80px 80px 80px 0; max-width: 660px; } #commitment #commitment01 .l_col-2.container {} #commitment #commitment01 .l_col-2.container .l_col-2 {} #commitment #commitment01 .l_col-2.container .l_col-2 figure {} #commitment #commitment01 .l_col-2.container .l_col-2 figure img {} #commitment #commitment01 .l_col-2.container .l_col-2 figure:first-child img { border-radius: 0 80px 80px 80px;} #commitment #commitment01 .l_col-2.container .l_col-2 figure:last-child img { border-radius: 80px 0 80px 80px;} #commitment #commitment01 .l_col-2.container .text { padding-top: 40px;} #commitment #commitment01 .l_col-2.container .text p {} } @media screen and (min-width:768px) and ( max-width:1210px) { #commitment #commitment01 > .l_col-2:not(.container) .text { padding-left: 20px;} #commitment #commitment01 > .l_col-2:not(.container) figure { padding-left: 0;} } @media (max-width: 767px) { #commitment #commitment01 {} #commitment #commitment01 .title-b {} #commitment #commitment01 > .l_col-2:not(.container) { margin-left: 15px; margin-right: 15px; flex-direction: column-reverse; margin-bottom: 35px;} #commitment #commitment01 > .l_col-2:not(.container) .text {} #commitment #commitment01 > .l_col-2:not(.container) .text p {} #commitment #commitment01 > .l_col-2:not(.container) figure { position: relative; width: calc(100% + 30px); left: -15px; } #commitment #commitment01 > .l_col-2:not(.container) figure img { border-radius: 60px 0 60px 60px; } #commitment #commitment01 .l_col-2.container {} #commitment #commitment01 .l_col-2.container .l_col-2 { margin-bottom: 40px;} #commitment #commitment01 .l_col-2.container .l_col-2 figure { width: 50%; position: relative; left: -15px;} #commitment #commitment01 .l_col-2.container .l_col-2 figure img {} #commitment #commitment01 .l_col-2.container .l_col-2 figure:first-child img { border-radius: 0 60px 60px 60px;} #commitment #commitment01 .l_col-2.container .l_col-2 figure:last-child { left: auto; right: -15px;} #commitment #commitment01 .l_col-2.container .l_col-2 figure:last-child img { border-radius: 60px 0 60px 60px;} #commitment #commitment01 .l_col-2.container .text {} #commitment #commitment01 .l_col-2.container .text p {} } /*------------------------------------------------------ [commitment] commitment02 ------------------------------------------------------*/ #commitment #commitment02 {} #commitment #commitment02 .container {} #commitment #commitment02 .title-b {} #commitment #commitment02 .l_col-2 {} #commitment #commitment02 .l_col-2 figure {} #commitment #commitment02 .l_col-2 figure img { width: 100%;} #commitment #commitment02 .l_col-2 .text {} #commitment #commitment02 .l_col-2 .text p {} @media (min-width: 768px) { #commitment #commitment02 {} #commitment #commitment02 .container {} #commitment #commitment02 .title-b { position: relative; top: 70px; max-width: 560px; margin-left: auto; margin-right: 0; } #commitment #commitment02 .l_col-2 { position: relative; max-width: 1600px; margin-left: auto; margin-right: auto; margin-bottom: 55px; } #commitment #commitment02 .l_col-2 figure { width: calc(50% - 20px); margin-bottom: 0; padding-left: 60px; text-align: left; } #commitment #commitment02 .l_col-2 figure img { border-radius: 80px 80px 0 80px; max-width: 660px; } #commitment #commitment02 .l_col-2 .text { width: calc(50% - 20px); padding-top: 70px; } #commitment #commitment02 .l_col-2 .text p { max-width: 560px; margin-right: auto; margin-left: 0; } } @media screen and (min-width:768px) and ( max-width:1210px) { #commitment #commitment02 .title-b {margin-left: calc(50% + 20px);} #commitment #commitment02 .l_col-2 figure { padding-left: 0;} #commitment #commitment02 .l_col-2 .text { padding-right: 20px;} } @media (max-width: 767px) { #commitment #commitment02 {} #commitment #commitment02 .container {} #commitment #commitment02 .title-b {} #commitment #commitment02 .l_col-2 {} #commitment #commitment02 .l_col-2 figure {} #commitment #commitment02 .l_col-2 figure img { border-radius: 0 60px 60px 60px; } #commitment #commitment02 .l_col-2 .text { margin-left: 15px; margin-right: 15px;} #commitment #commitment02 .l_col-2 .text p {} } /*------------------------------------------------------ ------------------------------------------------------*/ @media (min-width: 768px) { } @media (max-width: 767px) { }