@charset "utf-8";
/* CSS Document */

/*-------------------------------------------------------------
 *
 *					style_aboutas.css
 *
 *-------------------------------------------------------------*/

/* common */
.text-area section h4.commonH4  { font-size: 190%; line-height: 1.4; margin-bottom: 10px; letter-spacing:0.05em; }
.text-area section p.commonP    { font-size: 127%; margin-bottom: 40px; }


/* index */
#allContainer.aboutus .text-area h4     { font-size: 270%; line-height: 1; font-weight: 600; letter-spacing:0.02em; margin-bottom:4px; margin-left:-2px; }
#allContainer.aboutus .text-area p      { font-size: 120%; }

#allContainer.aboutus section           { background: #fff; padding: 40px 50px 60px; box-sizing: border-box; margin-bottom: 30px; }
#allContainer.aboutus section div.colBlue{ position: relative; z-index: 2; }
#allContainer.aboutus section img       { margin: -30px auto 20px; position: relative; z-index: 1; }
#allContainer.aboutus section .btn      { margin: 0 auto; min-width: 245px; min-height: 68px; }

#allContainer.aboutus .twoBox           { display: flex; justify-content: space-between; }
#allContainer.aboutus .twoBox section           { width: calc(100% / 2 - 15px); }
#allContainer.aboutus .twoBox section .btn a    { line-height: 1.2; padding: 12px 0 14px; }

/* career_training */
.career_training .text-area section h4.commonH4            { color: #a68367; border: 1px solid #a68367; font-size: clamp(20px, calc(100vw* 24 / 1200), 24px); padding: 14px 19px; margin-bottom: 20px; }
.career_training .text-area section img { margin: 60px auto; }
.career_training .text-area section img + img { margin-top: 120px; }

.career_training #career_training-top .flex                                 { display: flex; column-gap: 30px; }
.career_training #career_training-top .flex img                             { margin: 0 0 0 auto; }
.career_training #career_training-top .flex div                             { max-width: 640px; }
.career_training #career_training-top .flex h4                              { color: #a68367; font-size: clamp(28px, calc(100vw* 32 / 640), 32px); line-height: 1.5; margin-bottom: 40px; }
.career_training #career_training-top .btnArea                              { max-width: 787px; margin: 50px auto 180px; display: flex; flex-wrap: wrap; justify-content: center; gap: 23px 20px; }
.career_training #career_training-top .btnArea .btn                         { width: 248px; height: 70px; }
.career_training #career_training-top .btnArea .btn > a                     { padding-left: 0; padding-right: 0px; padding-top: 19px; }

.career_training .text-area section.training                                { position: relative; padding-top:240px; }
.career_training .training-career-support-flex                              { display: flex; column-gap: 20px; align-items: flex-start; }
.career_training .training-career-support-example                           { margin-top: 60px; max-width: 433px; }
.career_training .training-career-support-example p                         { color: #000; font-size: clamp(18px, calc(100vw* 20 / 433), 20px); margin-bottom: 8px; }
.career_training .training-career-support-example > ul                      { background-color: #ededed; padding: 20px 25px; }
.career_training .training-career-support-example ul                        { display: inline-block;  }
.career_training .training-career-support-example > ul li                   { text-indent: -1em; padding-left: 1em; }
.career_training .training-career-support-example li.brown-disc::before     { content:  ""; width:  10px; height:  10px; display: inline-block; background-color: #a68367; border-radius:  50%; margin-right: 7px; }

/* strength */
.strength .strength-container           { display: flex; flex-wrap: wrap; }
.strength .strength-box                 { width: 50%; padding-right: 30px; border-bottom: 1px solid #e9ebec; box-sizing: border-box; padding-bottom: 45px; display: flex; flex-direction: column; padding-top: 30px; }
.strength .strength-box:nth-child(odd)  { border-right: 1px solid #e9ebec; }
.strength .strength-box:nth-child(even) { padding-left: 30px; }
.strength .strength-box dl              { align-items: center; margin-bottom: 20px; flex-wrap: nowrap; }
.strength .strength-box dt              { height: 75px; width: 75px; border-radius: 50%; line-height: 72px; text-align: center; font-size: 250%; margin-right: 20px; color: #fff; font-family:outfit; font-weight:600; }
.strength .strength-box dd              { font-size: 190%; letter-spacing:0.05em; line-height: 1.3; }
.strength .strength-box div             { margin-bottom: 40px; }
.strength .strength-box img             { margin: auto; }

.strength .strength-container:last-child section     { border-bottom: none; }


/* works */
.works .works-index-container               { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 50px; }
.works .works-index-container .works-index-box              { width: calc((100% - 20px) / 4); } 
.works .works-index-container .works-index-box p.textCenter { font-size: clamp(12px, calc(100vw* 14 / 1200), 14px); margin: 15px 0 50px; line-height: 1.5; }
.works .works-index-container .works-index-box img          { width: 100%; }

.works .works-index-container .works-index-box a            { border-radius: 45px; }
.works .works-index-container .works-index-box a:hover      { /*border: 2px solid;*/ opacity: 0.8; }

.child.grandchild.works #category           { margin-bottom: 0; }
.works .works-container                     { margin-top: -10px; }
.works .works-container #head #headImg      { position: relative; float: right; padding-left: 80px; background-color: #fff; overflow: hidden; padding-top: 30px; }
.works .works-container #head #headImg div    { position: absolute; color: #fff; left: 0; right: -80px; bottom: 15%; font-size: 110%; letter-spacing:0.05em; }
.works .works-container #head #headImg h1     { display: inline; font-size: 100%; }


.works .works-container .works-box                      { border-bottom: 1px solid #e9ebec; padding: 24px 0; }
.works .works-container #middle .works-box:last-child   { border-bottom: none; }              
.works .works-container .works-box dl              { align-items: baseline; margin-bottom: 10px; }
.works .works-container .works-box dt              { height: 35px; width: 35px; border-radius: 50%; line-height: 34px; text-align: center; font-size: 124%; margin-right: 20px; color: #fff; font-family:outfit; font-weight:600px; }
.works .works-container .works-box dd              { font-size: 140%; letter-spacing:0.05em; width: calc(100% - 55px); }

.works .works-container #middle             { clear: both; }

#works-list-area                                    { margin: 80px auto 0; }
#works-list-area #works-list-common .btn            { width: 240px; height: auto; border-radius: 40px; }
#works-list-area #works-list-common .btn > a        { padding: 12px 0 14px 0; }

/* data */
.data .grandchild-category                          { max-width: 1200px; margin: 0 auto; margin-bottom: 80px; width: min(93%, 1200px); }
.data .text-area section                            {  position: relative; }
#allContainer.data .bg-gray                         { margin-top: 0; }
.data section + section                             { margin-top: 200px; }

.data section > h4                                  { font-size: 200%; margin-bottom: 30px; }

.data .dataFlex                                     { display: flex; }
.data .flexDirection-column                         { flex-direction:column; }
.data .justifyC-between                             { justify-content: space-between; }
.data .align-items-center                              { align-items: center; }


.data .dataBox                                      { background: #fff; padding: 30px 31px 20px; }
.data .dataBox.gradient-border-image                { border-width: 15px; }

.data .dataBox .line-height                         { line-height: 1.25; }

.data .dataBox .f24                                 { font-size: 24px; }
.data .dataBox .f30                                 { font-size: 28px; letter-spacing:0.05em; }
.data .dataBox .f40                                 { font-size: 40px; }
.data .dataBox .f47                                 { font-size: 47px; }
.data .dataBox .f70                                 { font-size: 70px; }
.data .dataBox .f110                                { font-size: 110px; }

.data .mR20                                         { margin-right: 20px; }
.data .mB20                                         { margin-bottom: 20px; }

/* 
.data .dataBox .gradient-text                       { font-family: 'メイリオ', 'Meiryo', 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; }

*/


    /* dataBox1 */
    .data .dataBox.dataBox1 p.colBlue               { font-size: 36px; }
    .data .dataBox.dataBox1 p.colBlue > span        { font-size: 47px; }
    .data .dataBox.dataBox1 .gradient-text-set      { margin-top: 50px; }
    .data .dataBox.dataBox1 .gradient-text          { font-size: 135px; }
    .data .dataBox.dataBox1 .gradient-text + span   { font-size: 45px; }
    .data .dataBox.dataBox1 > p                     { margin-top: 10px; }


    /* dataBox2 */
    .data .dataBox.dataBox2                         { min-width: 430px; }

    /* dataBox3 */
    .data .dataBox.dataBox3                         { max-width: 320px; padding-top: 55px; }
    .data .dataBox.dataBox3 .gradient-text-set      { position: relative; }
    .data .dataBox.dataBox3 .gradient-text-set > span  { position: absolute; top: -29px; font-size: 17px; }
    .data .dataBox.dataBox3 .gradient-text-set > span.bunkei    { left: 13px; }
    .data .dataBox.dataBox3 .gradient-text-set > span.rikei     { right: 13px; }
    .data .dataBox.dataBox3 > p                     { margin-top: 10px; }


    /* dataBox4 */
    .data .dataBox.dataBox4                         { max-width: 508px; }
    .data .dataBox.dataBox4 > p                     { width: 100%; margin-top: 20px; margin-left: 0; }
    .data .dataBox.dataBox4 > div:first-child       { border-right: 2px solid #ebebeb; padding-right: 20px; float: left; margin-right: 20px; }
    .data .dataBox.dataBox4 > div > p.colBlue       { font-size: 17px; margin-bottom: 5px; }



    /* data1Img */
    .data .data1Img                                 { position: absolute; bottom: -250px; right: 0; }

    /* dataBox5 */
    .data .dataBox.dataBox5 p.colBlue               { font-size: 44px; display: inline-block; margin-right: 11px; }
    .data .dataBox.dataBox5 p.colBlue > span        { font-size: 72px; margin-left: -6px; }
    .data .dataBox.dataBox5 .gradient-text-set      { display: inline; position: relative; z-index: 2; }
    .data .dataBox.dataBox5 .gradient-text          { font-size: 180px; }
    .data .dataBox.dataBox5 .gradient-text + span   { font-size: 45px; }
    .data .dataBox.dataBox5 img                     { margin-left: auto; margin-top: -230px; margin-bottom: 20px; }
    .data .dataBox.dataBox5 p:not(.colBlue)         { margin-top: 15px; }

    /* dataBox6 */
    .data .dataBox.dataBox6                         { min-width: 300px; max-width: 368px; }
    .data .dataBox.dataBox6 .gradient-text-set      { margin-top: 50px; }
    .data .dataBox.dataBox6 p:not(.colBlue)         { margin-top: 10px; }


    /* dataBox7 */
    .data .dataBox.dataBox7                         { max-width: 467px; }
    .data .dataBox.dataBox7 .gradient-text-set      { margin-top: 50px; }
    .data .dataBox.dataBox7 p:not(.colBlue)         { margin-top: 10px; }


    /* dataBox8 */
    .data .dataBox.dataBox8                         { min-width: 320px; }
    .data .dataBox.dataBox8 .gradient-text          { font-size: 75px; }
    .data .dataBox.dataBox8 p.colBlue + p           { font-size: 19px; }
    
    /* dataBox9 */
    .data .dataBox.dataBox9                         { max-width: 400px; justify-content: space-around; }
    .data .dataBox.dataBox9 .gradient-text-set      { line-height: 2.1; }
    .data .dataBox.dataBox9 img                     { margin: 30px auto 10px; }
    .data .dataBox.dataBox9 > p                     { margin-top: 10px; }

    /* dataBox10 */
    .data .dataBox.dataBox10                        { max-width: 467px; max-height: 315px; position: relative; }
    .data .dataBox.dataBox10 .gradient-text-set     { margin-bottom: 20px; }
    .data .dataBox.dataBox10 .gradient-text-set p.colBlue     { margin-bottom: 10px; }
    .data .dataBox.dataBox10 .gradient-text         { font-size: 60px; }

    /* data1Img */
    .data .data4Img                                 { position: absolute; bottom: -5%; right: 4%; }

    /* dataBox11 */
    .data .dataBox.dataBox11                        { max-width: 500px; }
    .data .dataBox.dataBox11 p.f30                  { margin-bottom: 5px; }             
    .data .dataBox.dataBox11 table th               { font-weight: normal; min-width: 100px; text-align: left; vertical-align: bottom; }
    .data .dataBox.dataBox11 table td .gradient-text{ font-size: 40px; padding-left: 5px; }


    /* workstyle　*/
    .workstyle .gray                                { background: #ebebeb; }
    .workstyle div.workstyleBox + div.workstyleBox  { margin-top: 110px; }

        /* system */
        .workstyle #system section                      { display: flex; justify-content: space-between; border-width: 2px; box-sizing: border-box; padding: 30px; }
        .workstyle #system section + section            { margin-top: 30px; }
        .workstyle #system section.shikaku article.bgBlue > div     { min-width: 250px; background: #d1e4f1; min-height: 140px; text-align: center; margin-left: 20px; font-size: 145%; padding-top: 10px; }
        .workstyle #system section.shikaku article.bgBlue > div span{ font-size: 260%; line-height: 1.3; margin-left: 10px; font-family:outfit; font-weight:600; }
        .workstyle #system section article + article                { display: flex; justify-content: space-between; align-items: center; margin-left: 20px; }

        /* office */
        #office .slideArea          { margin: 0 70px; }
        #office section.gray        { box-sizing: border-box; padding: 30px 30px 60px; }
        #office section.gray + section.gray { margin-top: 30px; overflow: hidden; clear: both; }
        #office .officeTitle        { position: relative; margin-bottom: 70px; }
        #office .officeTitle p      { font-size: 180%; }
        #office .officeTitle .gradient-text      { position: absolute; right: 0; top: 0; font-size: 350%; font-family:outfit; font-weight:600; }

        #office .slideArea .bx-wrapper                                      { background-color: transparent; border: none; box-shadow: none; }
        #office .slideArea .bx-wrapper img,
        #office .slideArea .movOpen                                         { float: left; width: 660px;  }
        #office .slideArea .bx-wrapper .bx-pager.bx-default-pager a         { background-color: #82b2e2; width: 11px; height: 11px; margin: 0 9px; }
        #office .slideArea .bx-wrapper .bx-pager.bx-default-pager a.active  { background: #0066c7; }

        #office .slideArea.slideNone .bx-wrapper .bx-pager.bx-default-pager a   { display: none; }
        #office .slideArea.slideNone > div   { display: flex; align-items: flex-start;  }


        #office .slideArea .bx-wrapper .bx-prev,
        #office .slideArea .bx-wrapper .bx-next                             { background: none!important; }
        #office .slideArea .bx-wrapper .bx-controls-direction a             { width: 50px; height: 50px; text-indent: -100%;     color: transparent; }
        #office .slideArea .bx-wrapper .bx-controls-direction a:before,
        #office .slideArea .bx-wrapper .bx-controls-direction a:after       { content: ''; position: absolute; top: 4px; left: 88px; }
        #office .slideArea .bx-wrapper .bx-controls-direction a:after       { width: 25px; height: 25px; border-top: 1px solid #03498c; border-right: 1px solid #03498c; transform: rotate(45deg); }
        #office .slideArea .bx-wrapper .bx-controls-direction a.bx-prev:after { transform: rotate(-135deg); left: -60px; }


        #office .slideArea .officeText                                      { float: right; width: 340px; padding-left: 30px; }
    
        /* event */
        #event                      { clear: both; }
        #event .eventContents       { display: flex; justify-content: space-between; flex-wrap: wrap; }
        #event article.gray         { width: calc(100% / 2 - 15px); padding: 50px; box-sizing: border-box; display: flex; flex-direction: column; margin-bottom: 20px; }
        #event .eventContents img,
        #event .eventContents .btn  { margin-left: auto; margin-right: auto; }
        #event .eventContents img.mainImg   { margin-top: 30px; margin-bottom: 50px; }
        #event section p.commonP            { margin-bottom: 10px; line-height: 1.4; }
        #event section p.commonP + div      { margin-bottom: 50px; }          
        #event .eventContents .btn          { margin-top: auto; }
        #event .eventContents .btn a        { line-height: 1.2; min-width: 250px; padding: 11px 60px 14px 50px; }

        /* popup */
            body.fixed            { position: fixed; width: 100%; left: 0; }
            .jscModal             { display: none; }
            .jscModalOpen         { display: block; opacity: 1; animation: scaleUp 0.3s linear; -webkit-animation: scaleUp 0.3s linear; }

            .popup                { height: 100vh; width: 100%; background: rgba(51,133,209,0.8);  opacity: 1; position: fixed; top: 0; left: 0; z-index: 2; overflow: auto; padding: 0 30px; }
            .popup .content         { background: #fff; margin: 120px auto; max-width: 1000px; }
            .popup .content > div   { width: 710px; margin: 0 auto; padding: 50px 0; }

            .reportList							{ margin-bottom: 105px; margin-top: 50px; }
            .planBlueBox_blue				    { background: #03498c; color: #fff; padding: 4px 9px; width: 90px; box-sizing: border-box; text-align: center; color: #fff; }
            .reportList .planBlueBox_blue		{ margin-bottom: 15px; }
            .reportList ul						{ display: block; }

            .popup .content section            { border-top: 2px solid #81a4c6; padding: 15px 0; }
            .popup .content section > h4.colBlue   { font-size: 200%; }
            .popup .content section > p.bold    { font-size: 103%; }
            .popup .content section > article   { margin: 25px 0; font-size: 14px; }
            .popup .content section > img + img { margin-top: 20px; }
            .popup .content section > img:last-child { margin-bottom: 70px; }

            #event .popup .content .btn a       { margin: 70px auto 50px; padding: 22px 60px 24px 50px; }


    /* requirements */
        .requirements section + section         { margin-top: 110px; }
        .requirements section .detail p.colBlue	{ font-size: 25px; margin: 8px 0 12px; }
        .requirements section .detail		{ display: flex; justify-content: space-between; flex-wrap: wrap; margin-top: 33px; }
        .requirements section .detail div	{ background-color: #d1e4f1; text-align: left; box-sizing: border-box; display: flex; flex-direction: column; padding: 2% 2.5% 4%; width: calc((100% - 35px) / 3); max-width: none; min-height: 330px; }

        .table-requirements table					{ margin-top: 50px; border-collapse: separate; border-spacing: 50px 0; margin-left: -50px; width: calc(100% + 100px); }
        .table-requirements .table1 tr > *			{ background: none; padding: 15px 15px 15px 0; }
        .table-requirements .table1 th				{ font-weight: normal; color: #003067; width: 210px; text-align: left; vertical-align: top; border-width: 2px 0 0 0; }
        .table-requirements .table1 td				{ border-top: 1px solid #ddd; }

        .table-requirements .table1 tr:last-child th	{ border-bottom: 2px solid #003067; }
        .table-requirements .table1 tr:last-child td	{ border-bottom: 1px solid #ddd; }
        
        .table-requirements .tblStyleNone			{ margin:20px 0; width:100%; border-spacing: initial; }
        .table-requirements .tblStyleNone tr >*		{ padding: 0; border:none; }
        .table-requirements .tblStyleNone th		{  color: #535d64; }
        .table-requirements .tblStyleNone tr:last-child td	{ border: none; }

        /* requirements */
		.dl2								{ display:block; overflow:hidden; margin-top: 25px; }
		.dl2 dt								{ float:left; width:1.3em; }
		.dl2 dd								{ margin:0 0 0 1.3em; }

        /* benefits */

        .requirements .benefits > .grandchild-category.colBlue  {/* margin-top: 180px;  */ margin-bottom: 60px; }
        .requirements .benefits .accordionSet					{ margin: 0 0 20px; text-align: left; }
        .requirements .benefits .accordion_one					{ border: 2px solid #dddee0; }

        .requirements .benefits .accordion_one .accordion_header 		{ color: #03498f; font-size: 20px; position: relative; z-index: +1; cursor: pointer; transition-duration: 0.2s; display: flex; align-items: center; }
        .requirements .benefits .accordion_one .accordion_inner 		{ display: none; padding: 10px 64px 10px 86px; box-sizing: border-box; }

        .accordion_one .accordion_header .i_box .one_i:before,
        .accordion_one .accordion_header .i_box .one_i:after 		{ display: flex; content: ''; background-color: #107ec2; border-radius: 10px; width: 27px; height: 3px; position: absolute; top: 29px; right: 20px; -webkit-transform: rotate(0deg); transform: rotate(0deg);transform-origin: center center; transition: all 0.3s; }
        .accordion_one .accordion_header .i_box .one_i:before 		{ width: 3px; height: 26px; top: 18px; right: 32px; }
        .accordion_one .accordion_header.open .i_box .one_i:before 	{ transform: rotate(90deg); }


		.requirements .benefits .accordionSet:last-child			{ margin: 0 0 -30px; }
		.requirements .benefits .accordionSet .accordion_inner p { margin-bottom: 20px; text-indent: -1em; padding-left: 1em; }
		.requirements .benefits .accordionSet .accordion_inner p a { text-decoration: underline; }

		.requirements .benefits .accordion_one .accordion_header::before { font-family: outfit; content: attr(data-benefits-number); margin-right: 26px; font-weight: 500; font-size: 38px; line-height: 64px; width: 65px; height: 66px; text-align: center; color: #fff; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="1"]::before   { background-color: #1a7ed8; }
        .accordion_one .accordion_header[data-benefits-number="1"]:hover,
        .accordion_one .accordion_header[data-benefits-number="1"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="1"]           { background-color: #e8f2fb; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="2"]::before   { background-color: #1db0d3; }
        .accordion_one .accordion_header[data-benefits-number="2"]:hover,
        .accordion_one .accordion_header[data-benefits-number="2"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="2"]           { background-color: #e8f7fb; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="3"]::before   { background-color: #40c0b4; }
        .accordion_one .accordion_header[data-benefits-number="3"]:hover,
        .accordion_one .accordion_header[data-benefits-number="3"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="3"]           { background-color: #ecf9f7; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="4"]::before   { background-color: #64c76e; }
        .accordion_one .accordion_header[data-benefits-number="4"]:hover,
        .accordion_one .accordion_header[data-benefits-number="4"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="4"]           { background-color: #eff9f0; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="5"]::before   { background-color: #f4ab25; }
        .accordion_one .accordion_header[data-benefits-number="5"]:hover,
        .accordion_one .accordion_header[data-benefits-number="5"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="5"]           { background-color: #fef6e9; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="6"]::before   { background-color: #e7596b; }
        .accordion_one .accordion_header[data-benefits-number="6"]:hover,
        .accordion_one .accordion_header[data-benefits-number="6"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="6"]           { background-color: #fdeef0; }

        .requirements .benefits .accordion_one .accordion_header[data-benefits-number="7"]::before   { background-color: #b55a9b; }
        .accordion_one .accordion_header[data-benefits-number="7"]:hover,
        .accordion_one .accordion_header[data-benefits-number="7"].open,
        .requirements .benefits .accordion_one .accordion_inner[data-benefits-number="7"]           { background-color: #f7eef5; }



    /* pamphlet */
    .pamphlet .pamphletArea section         { width: fit-content; }
    .pamphlet .pamphletArea section a:hover { opacity: 0.8; }

    .pamphlet .pamphletArea p.explanation   { margin-top: 10px; }


    /* movie */
    .movieText .dlType02					{ display:block; overflow:hidden; }
    .movieText .dlType02 dt					{ float:left; width:1.7em; margin-bottom: 20px; }
    .movieText .dlType02 dd					{ margin:0 0 0 1.7em; margin-bottom: 28px; }

    .movie .accordionSet					        { border: 2px solid #dddee0; }
    .movie .accordion_one .accordion_header 		{ color: #fff; font-size: 22px; position: relative; z-index: +1; cursor: pointer; transition-duration: 0.2s; background: #6b7074; padding: 10px 60px 11px 25px; }
    .movie .accordion_one .accordion_inner          { display: block; }
    .movie .accordion_one .accordion_header .i_box .one_i:before,
    .movie .accordion_one .accordion_header .i_box .one_i:after     { background-color: #fff; }

    .movie .accordion_one .accordion_inner a        { width: 100%; display: block; padding: 10px 20px; border-top: 2px solid #dddee0; }
    .movie .accordion_one .accordion_inner a:hover  { text-decoration: none; color: #fff; background: #b3bbc2; }

    .movie .btn                             { margin-top: 60px; }



@media screen and ( max-width:1350px ) {
    /* data */
    .data .data1Img             { bottom: -410px; }
    .data section + section     { margin-top: 380px; }

    /* career_training */

    /* works */
    .works .works-container #head #headImg img      { width: 100%; }
    .works .works-container #head #headImg div        { font-size: 1.3vw; }

    /* requirements */
    .table-requirements table 				{ border-collapse: initial; border-spacing: 0; margin: 0; width: 100%; margin-top: 30px; }
}

@media screen and (max-width: 1200px) {

    /* data */
    .dataBox5 + article                     { flex-wrap: wrap; }
    .data .dataBox.dataBox5 img             { margin-top: 0; width: 100%; max-width: fit-content; }
    
    .data .dataBox.dataBox8                 { margin-top: 20px; min-height: 350px; }

    #office .slideArea .bx-wrapper img,
    #office .slideArea.slideNone img,
    #office .slideArea .movOpen                             { width: calc(100% - 340px); }
    #office .slideArea .movOpen img                         { width: 100%; }

    /* requirements */
    .requirements section .detail div		{ width: calc((100% - 23px) / 3); }
    
}

@media screen and (max-width: 1170px) {
    .data .dataFlex.dataBox4-flexOrder      { display: block; }
    .data .dataBox.dataBox11                { margin-top: 20px; }
}


@media screen and ( max-width:1100px ) {
    /* index */
    #allContainer.aboutus section img       { width: 100%; max-width: fit-content; margin-top: 0; }
    
    /* career_training */
    .career_training .text-area section img { width: 100%; height: auto; max-width: fit-content; }
    .career_training .training-career-support-flex                              { display: block; }


    /* works */
    .works .works-container #head #headImg          { width: 60%; }
    .works .works-container #head .works-box        { float: none; width: 100%; }
    .career_training .training-career-support-example   { max-width: 600px; }

    /* data */
    .data .dataBox.dataBox2                 { min-width: initial; }
    .data .dataBox.dataBox5 img             { margin-top: 0; width: 100%; max-width: fit-content; }

    .data .data1Img                         { position: initial; }
    .data .data1Img img                     { margin-left: auto; margin-top: -30px; }
    .data .data4Img                         { position: initial; }
    .data .data4Img img                     { margin-left: auto; margin-top: 80px; }
    .data .dataBox.dataBox7                 { margin-top: 20px; }

    .data section + section                 { margin-top: 100px; }


    /* workstyle */
    .workstyle #system section article + article.bgBlue     { display: block; }
    .workstyle #system section.shikaku article.bgBlue > div +div { margin-top: 20px; }

    #office .slideArea                      { display: block; }
    #office .slideArea .bx-wrapper          { margin: 0 auto; }
    #office .slideArea .bx-wrapper .bx-pager.bx-default-pager   { left: 0; }

    #office .slideArea .bx-wrapper .bx-controls-direction a:before, 
    #office .slideArea .bx-wrapper .bx-controls-direction a:after   { top: 8px; left: 85px; }


    #event .eventContents img               { width: 100%; max-width: 100%; }
    .popup .content > div                   { padding-left: 30px; padding-right: 30px; }

}

@media screen and ( max-width:950px ) {
    /* index */
    #works-list-common .btn                 { width: 200px; }

    #office .slideArea .bx-wrapper img, 
    #office .slideArea.slideNone img,
    #office .slideArea .movOpen             { width: calc(100% - 240px);; }
    #office .slideArea .officeText          { width: 240px; }

    /* data */
    .data .dataFlex.dataBox1-flexOrder      { display: block; }
    .data .dataFlex.dataBox1-flexOrder > .dataBox2-flexOrder     { display: flex; margin-top: 20px; }
    .data .dataBox.dataBox2                 { margin-right: 20px; }

    .data .dataFlex.dataBox9-flexOrder      { display: block; }
    .data .dataBox.dataBox10                { margin-top: 20px; }
}


@media screen and ( max-width:767px ) {
    /* common */
    .text-area section h4.commonH4          { font-size: 160%; }
    .text-area section p.commonP            { font-size: 114%; margin-bottom: 20px; }

    /* index */
    #allContainer.aboutus .text-area h4     { font-size: 230%; }
    #allContainer.aboutus .text-area p      { font-size: 90%; }
    #allContainer.aboutus .twoBox           { display: block; }
    #allContainer.aboutus section,
    #allContainer.aboutus .twoBox section   { width: 100%; padding: 30px 30px 40px; }
    #allContainer.aboutus .twoBox section .btn a    { padding-top: 16px; }

    .message .main-content .text-message    { margin: 50px 0 0 0; padding: 25px; }
    .message .main-content .text-message h4              { font-size: 158%; margin-bottom: 29px; }
    .message .main-content .text-message > p             { font-size: 106%; }

    .message .main-content .text-message .bottom-message { display: block; margin-top: 30px; }
    .message .main-content .text-message .bottom-message .textRight      { width: 150px; margin: 0 0 140px auto; text-align: left!important; }
    .message .main-content .text-message .bottom-message .textRight img  { width: 140px; height: auto; margin-top: 10px; }
    .message .main-content .text-message .bottom-message p:last-child img{ width: 165px; height: auto; }

    /* career_training */
    .career_training #career_training-top .flex         { display: block; }
    .career_training #career_training-top .flex img     { margin-right: auto; margin-top: 50px; }
    .career_training #career_training-top .btnArea .btn { height: 64px; }

    /* strength */
    .strength .strength-container        { display: block; }
    .strength .strength-box              { width: 100%; padding-right: 0; }
    .strength .strength-box:nth-child(odd)  { border-right: none; }
    .strength .strength-box:nth-child(even) { padding-left: 0; }

    .strength .strength-box dt              { height: 60px; width: 60px; line-height: 60px; font-size: 230%; }
    .strength .strength-box dd              { font-size: 160%; line-height: 1.4; }

    /* works */
    .works .works-index-container .works-index-box              { width: calc((100% - 15px) / 2); }
    .works .works-index-container .works-index-box p.textCenter { margin: 8px 0 35px; }

    .child.grandchild.works #category           { margin-bottom: 40px; }


    .works .works-container #head h4            { border-width: 11px; font-size: 140%; padding: 8px 25px; }
    .works .works-container #head #headImg      { float: none; width: 100%; margin-top: 0; padding-left: 0; }
    .works .works-container #head #headImg div    { font-size: 110%; right: 0; }


    .works .works-container .works-box dt       { height: 25px; width: 25px; line-height: 23px; font-size: 100%; margin-right: 10px; }
    .works .works-container .works-box dd       { font-size: 110%; }

    #works-list-area                            { margin: 50px auto 0; }
    #works-list-area #works-list-common .btn    { width: 200px; }



    /* data */
    .data section > h4                                   { font-size: 154%; margin-bottom: 19px; }
    .data .dataBox                                       { padding: 25px; } 
    .data .dataBox.gradient-border-image                 { border-width: 11px; }      

    .data .dataBox .f30     { font-size: 22px; }
    .data .dataBox .f40     { font-size: 30px; }
    .data .dataBox .f47     { font-size: 35px; }
    .data .dataBox .f70     { font-size: 55px; }
    .data .dataBox .f110    { font-size: 85px; }

        /* dataBox1 */
        .data .dataBox.dataBox1                 { margin-right: 0; margin-bottom: 20px; }
        .data .dataBox.dataBox1 p.colBlue       { font-size: 28px; }
        .data .dataBox.dataBox1 p.colBlue > span{ font-size: 36px; }

        .data .dataBox.dataBox1 .gradient-text  { font-size: 85px; }
        .data .dataBox.dataBox1 .gradient-text + span   { font-size: 31px; }

        .data .dataFlex.dataBox1-flexOrder > .dataBox2-flexOrder     { display: block; }


        /* dataBox3 */
        .data .dataBox.dataBox3                     { width: 260px; }

        /* dataBox4 */
        .data .dataBox.dataBox4                     { width: 330px; }

        /* dataBox5 */
        .data .dataBox.dataBox5 p.colBlue           { font-size: 33px; }
        .data .dataBox.dataBox5 p.colBlue > span    { font-size: 51px; margin-left: -4px; }
        .data .dataBox.dataBox5 .gradient-text      { font-size: 124px; }
        .data .dataBox.dataBox5 .gradient-text + span   { font-size: 34px; text-align: right; display: block; }
        .data .dataBox.dataBox5 img                 { margin-top: 30px; }

        /* dataBox7 */
        .data .dataBox.dataBox7                     { margin-bottom: 20px; }

        /* dataBox8 */
        .data .dataBox.dataBox8                     { margin-top: 0; min-height: 320px; }
        .data .dataBox.dataBox8 .gradient-text      { font-size: 60px; }

        .dataBox9-flexOrder                         { flex-direction: column; }
        .data .dataBox.dataBox9                     { order: 2; margin-top: 20px; }

        .data .dataBox.dataBox10                    { max-height: initial; }
        .data .dataBox.dataBox10 .gradient-text     { font-size: 47px; }


    /* workstyle */
        /* system */
        .workstyle #system section                      { display: block; }
        .workstyle #system section article + article    { margin-top: 50px; margin-left: 0; justify-content: center; }
        .workstyle #system section.shikaku article.bgBlue > div { max-width: 180px; margin-left: auto; margin-right: auto;  }

        /* office */
        #office section.gray                            { padding-bottom: 80px; }

        #office .officeTitle                            { margin-bottom: 10px; }
        #office .officeTitle p                          { font-size: 150%; }
        #office .slideArea                              { margin: 0; }
        #office .slideArea .bx-wrapper img,
        #office .slideArea.slideNone img, 
        #office .slideArea .movOpen                     { width: 100%; float: none; }
        #office .slideArea .officeText                  { width: 100%; float: none; padding-left: 0; }
        #office .slideArea .bx-controls.bx-has-controls-direction.bx-has-pager .bx-controls-direction { display: none; }
        #office .slideArea .officeText                  { margin-top: 80px; }

        #office .slideArea.slideNone > div              { display: block; }

        /* event */
        #event .eventContents                           { display: block; }
        #event article.gray                             { width: 100%; }
        #event article.gray:last-child                  { margin-bottom: 0; }

        .popup .content > div                           { width: 100%; }
        .popup .content section > h4.colBlue            { font-size: 150%; }
        #event .popup .content .btn a                   { margin: 20px auto 10px; }

    /* requirements */
        .requirements section .detail div		{ width: 100%; max-width: none; min-height: initial; padding: 25px; }
        .requirements section .detail div + div { margin-top: 13px; }
        .requirements section .detail p.colBlue	{ margin: 0 0 20px; line-height: 1.5; font-size: 180%; }

        .table1 > tbody > tr > *                        { display: list-item; list-style: none; }
        .table-requirements .table1 th				    { width: 100%; }
        .table-requirements .tblStyleNone			    { width:100%; }
		.table-requirements .tblStyleNone th		    { width:calc(100% / 4); }

        .requirements .benefits img                     { width: 100%; max-width: 100%; height: auto; }
        .requirements .benefits .accordion_one .accordion_header 						{ font-size: 115%; }
		.requirements .benefits .accordion_one .accordion_header::before				{ margin-right: 20px; font-size: 25px; width: 50px; height: 51px; line-height: 50px; }
		.requirements .benefits .accordion_one .accordion_header .i_box .one_i:after	{ width: 22px; right: 13px; top: 23px; }
		.requirements .benefits .accordion_one .accordion_header .i_box .one_i:before	{ top: 14px; right: 23px; height: 22px; }
		.requirements .benefits .accordion_one .accordion_inner							{ padding: 8px 47px 10px 38px; }

    /* pamphlet */
    .pamphlet .pamphletArea section img        { width: 100%; }


}

@media screen and ( max-width:500px ) {

    #office .officeTitle .gradient-text                 { top: initial; font-size: 230%; bottom: -320px; }
    #office .bx-wrapper .bx-pager                       { bottom: -33px; }      
}

@media screen and ( max-width:420px ) {
    #office .officeTitle .gradient-text                 { bottom: -270px; }
}

@media screen and ( max-width:400px ) {
    .strength .strength-box img                         { width: 100%; height: auto; }

    .data .dataBox.dataBox1 .gradient-text              { font-size: 82px; }
    .data .dataBox.dataBox1 .gradient-text + span       { font-size: 26px; }
    .data .dataBox.dataBox4                             { width: 100%; }
    .data .data1Img img                                 { width: 60%; margin-top: -20px; }

    .data .dataBox.dataBox5 p.colBlue                   { font-size: 29px; }
    .data .dataBox.dataBox5 p.colBlue > span            { font-size: 46px; }
    .data .dataBox.dataBox5 .gradient-text              { font-size: 118px; }

    .data .dataBox.dataBox6                             { width: 100%; min-width: initial; }
    .data .dataBox.dataBox10 .gradient-text             { font-size: 44px; }

    .data .data4Img img                                 { width: 60%; margin-top: 50px;}

    #office .officeTitle .gradient-text                 { bottom: -250px; }

    .works .works-container #head #headImg div          { font-size: 90%; }

}