@charset "utf-8"; @media screen and (max-width: 1440px){ html{ zoom: .8; } } @media screen and (max-width: 1400px){ .position .strategic > div{ display: none; } } @media screen and (max-width: 1200px) { .compensation{ width: 100%; } .contact{ width: 100%; } .recruitment{ width: 100%; } .position{ width: 100%; } .position .strategic .content li div{ width: 50%; } .school{ width: 90%; } .school > p { text-indent: 32px; text-align: justify; } .school .table .dr > li{ text-align: justify; } } @media screen and (max-width: 1000px){ .school img{ width: 100%; } } @media screen and (max-width: 900px) { .contact{ width: 90%; } .recruitment{ width: 90%; } .contact .tel ul li .top p{ width: 80%; } .recruitment .tel ul li .top p{ width: 80%; } .position .strategic .list{ width: 95%; margin: auto; } .position .strategic .list li{ width: 100%; margin-left: 0; margin-bottom: 10px; } .position .strategic .list li + li{ margin-left: 0; } .position .strategic .content li img{ margin-left:0 ; } .position .strategic .content li div{ width: 60%; } .position .strategic .content li div p{ text-align: justify; } } @media screen and (max-width: 700px){ .school .table .dr li p{ padding: 40px 9%; border: none; } } @media screen and (max-width: 620px) { /* .position .strategic .content li div{ width: 50%; }*/ } @media screen and (max-width: 600px) { .contact .tel ul li .top p{ width: 70%; } .contact .tel ul li .bottom{ padding: 0; } .contact .tel ul li .bottom div{ width: 100%; margin-left: 0; } .recruitment .tel ul li .top p{ width: 70%; } .recruitment .tel ul li .bottom{ padding: 0; } .recruitment .tel ul li .bottom div{ width: 100%; margin-left: 0; } } @media screen and (max-width: 510px) { .position .strategic .content li{ padding: 14px; } .position .strategic .content li div{ margin-left: 60px; } .recruitment .tel ul li .bottom a{ top: 0; } .recruitment .tel ul li{ text-align: justify; } } @media screen and (max-width: 414px){ .position h3{ font-size: 18px; margin-bottom: 30px; } .position .strategic .list li{ font-size: 17px; height: 60px; line-height: 60px; } .position .strategic .content li div h4{ font-size: 16px; margin-bottom: 15px; } .position .strategic .content li div p{ font-size: 12px; line-height: 25px; } .position .strategic .content{ padding-bottom: 50px; } .recruitment h3{ font-size: 18px; margin-bottom: 30px; } .recruitment .tel ul li .top p{ font-size: 16px; } .recruitment .tel ul li .top span{ font-size: 14px; } .recruitment .tel ul li .bottom div h4{ font-size: 13px; } .recruitment .tel ul li .bottom .responsibilities ul li{ font-size: 12px; } .recruitment .tel ul li .bottom a{ font-size: 14px; } .recruitment .tel ul li{ font-size: 12px; } .compensation{ padding-bottom: 50px; } .compensation h3{ font-size: 18px; margin-bottom: 30px; } .contact h3{ font-size: 18px; margin-bottom: 30px; } .contact .tel ul li .top p{ font-size: 16px; } .contact .tel ul li .top span{ font-size: 14px; } .contact .tel ul li .bottom div{ font-size: 12px; line-height: 25px; } } @media screen and (max-width: 410px){ .contact .tel ul li .bottom img{ width: 100%; height: 100%; } } @media screen and (max-width: 400px) { .contact .tel ul li .top p{ width: 60%; text-indent: 20px; } .contact{ padding-top: 50px; padding-bottom: 100px; } .recruitment .tel ul li .top p{ width: 60%; text-indent: 20px; } .recruitment{ padding-top: 50px; padding-bottom: 100px; } }