/*====================================
    General
====================================*/

*{
    margin: 0;
    padding: 0;
}

body{
     font-family: 游ゴシック体, 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
     font-weight: 500;
     margin: 0;
     background-color: rgb(253, 253, 253);
     color: #000000;
     width: 100%;
}

li{
   list-style-type: none;
}

a{
  text-decoration: none;
  transition-duration: 200ms;
}

main{
     width: 100%;
}

.contents{
          margin: auto;
}

/* ============== Header Css Part ============== */

header{
       width: 100%;
       /* position: fixed; */
       position: relative;
       padding: 1rem 0;
       margin: 0;
       z-index: 2;
       transition: background-color 0.3s; 
       background-color: #fff; 
}

header.scrolled {
                 position: fixed;
                 background-color: #fff; 
                 transition: background-color 0.3s; 
                 box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.2);
}

.navbar.scrolled {
                  background-color: rgba(255, 255, 255, 0.9); 
                  padding: 0.5rem 0; 
}

header > nav{
             width: 90%;
             margin: auto;
             display: flex;
             position: relative;
}

header > nav > .nav-list{
                         display: flex;
                         position: absolute;
                         right:0;
}

header > nav > .nav-list > li{
                              margin-left: 1.6rem;
                              padding: 1rem 0;
                              font-size: 16px;
}

header > nav > .nav-list > li > a{
                                  color: #000;
}

header > nav > .nav-list > li > a:hover{
                                        text-decoration: underline;
}

header > nav > .nav-list > li.header_btn{
                                         padding: .7rem 0;
}

header > nav > .nav-list > li.header_btn > a{
                                             display: block;
                                             color:#fff;
                                             background-color: #00AF56;
                                             border: #00AF56 solid 1px;
                                             width: 9.5rem;
                                             padding: .3rem 0;
                                             text-align: center;
}

header > nav > .nav-list > li.header_btn > a:hover{
                                                   color: #00AF56;
                                                   background-color: #fff;
                                                   text-decoration: none;
                                                   cursor: pointer;
}

header > nav > .nav-list > li.header_btn:last-child{
                                                    margin-left: 0.7rem;
}

header > nav > .nav-list > li.header_btn:last-child > a{
                                                        color: #fff;
                                                        background-color: #00AF56; 
                                                        width: 6.5rem;
}

header > nav > .nav-list > li.header_btn:last-child > a:hover{
                                                              color: #00AF56;
                                                              background-color: #fff;
                                                              text-decoration: none;
                                                              cursor: pointer;
}


/* ============ Testing css =========== */

header > nav > .menu-toggle {
                             display: none; /* Hidden by default */
                             flex-direction: column;
                             cursor: pointer;
}

header > nav > .menu-toggle > .bar{
                                   height: 3px;              
                                   width: 25px;             
                                   background-color: #000;   
                                   margin: 3px 0;      
}

.close-icon {
             font-size: 30px;
             cursor: pointer;
             display: none;
}

/*====================================
    Footer
====================================*/

#footer_contact{
                background-image: url(../images/footer_contact.png);
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;
                margin-bottom: 3rem;
                width: 100%;
}

#footer_contact > div.footer-container{
                                       /*background-color: rgba(0, 175, 85, 0.3);*/
                                       background: linear-gradient(45deg, rgba(0, 175, 85, 0.2),rgba(0, 175, 85, 0.7));
                                       padding: 3rem 0 5rem;
                                       text-align: center;
}

#footer_contact h2{
                   color: #fff;
                   font-weight: bold;
                   margin-bottom: 0;
                   font-size: 4.5rem;
}

#footer_contact h2::after{
                          border: none;
}

#footer_contact .footer-container p{
                                    color: #fff!important;
                                    padding-bottom: 5px;
                                    
}

#footer_contact .footer-container .button-box-container{
                                                        margin-top: 3rem;
                                                        display: flex;
                                                        justify-content: center;
}

#footer_contact .footer-container .button-box-container a{
                                                          display: block;
                                                          color:#fff;
                                                          background-color: #00AF56;
                                                          height: 1.7rem;
                                                          width: 15rem;
                                                          padding: 2rem 0;
                                                          filter:drop-shadow(.4rem .4rem 0 rgba(255, 255, 255, 1));
}

#footer_contact .footer-container .button-box-container a:first-of-type{
                                                                        margin-right: 2rem;
}

#footer_contact .footer-container .button-box-container a:hover{
                                                                margin-top: .4rem;
                                                                margin-bottom: -.4rem;
                                                                margin-left: .4rem;
                                                                margin-right: -.4rem;
                                                                filter:none;
                                                                background-color: #018842;
}

#footer_contact .footer-container .button-box-container a:first-of-type:hover{
                                                                              margin-top: .4rem;
                                                                              margin-bottom: -.4rem;
                                                                              margin-left: .4rem;
                                                                              margin-right: 1.6rem;
                                                                              filter:none;  
}

/* ============ css of footer top section ============= */

#footer > #footer_top{
                      display: flex;
                      width: 1100px;
                      margin: auto;
                      border-top: 1px solid #000;
                      margin-bottom: 20px;
                      justify-content: center;
}

#footer > #footer_top > ul{
                           margin-right: 2.5rem;
                           margin-top: 20px;
}

#footer > #footer_top > .twitter-container{
                                           margin-top: 20px;
}

#footer > #footer_top > ul > li{
                                margin-bottom: .7rem;
}

#footer > #footer_top > ul > li > a{
                                    color: #000;
                                    font-size: 14px;
}

#footer > #footer_top > ul > li > a:hover{
                                          text-decoration: underline;
}

/* ============== css of footer bottom section =============== */

#footer > #footer_bottom{
                         padding-bottom: 20px;
                         margin: auto;
                         width: 1100px;
}

#footer > #footer_bottom > .footer-bottom-container{
                                                    display: flex;
                                                    justify-content: center;
                                                    margin: auto;
}

#footer > #footer_bottom > .footer-bottom-container > .footer-bottom-container-first{
                                                                                     display: flex;
}

#footer > #footer_bottom > .footer-bottom-container > .footer-bottom-container-second{
                                                                                      margin: 0 0 0 0.8rem;
                                                                                      display: flex;
}

#footer > #footer_bottom > .footer-bottom-container > .footer-bottom-container-first > .logo-div > img{
                                                                                                      height: 3rem;
                                                                                                      margin-right: 1.5rem;
}

#footer > #footer_bottom > .footer-bottom-container > .footer-bottom-container-second > .logo-div > img{
                                                                                                       height: 4rem;
                                                                                                       margin-right: 1.5rem;
}

/*====================================
    TOP
====================================*/

#top > #top_image{
                  position: relative; /* Make the container a positioning context for the overlay */
                  width: 100%;
                  height: 100%;
                  vertical-align: middle;
}

/* Make the image responsive */
#top > #top_image > img{
                        width: 100%;
                        height: 100%;           /* Make the image span the full height */
                        object-fit: cover;      /* Ensures the image covers the area while maintaining its aspect ratio */
                        display: block; /* Remove any unwanted space below the image */
}

#top > #top_image > .overlay{
                             position: absolute;
                             top: 0;
                             left: 0;
                             width: 100%;
                             height: 100%;
                             background: rgba( 255, 255, 255, 0.1);
                             z-index: 1; 
}

#top section{
             margin-bottom: 2rem;
}

#top h2{
        text-align: center;
        margin-bottom: 50px;
}

#top h2::after{
               content: '';
               display: block;
               width: 3rem;
               margin: auto;
               border-bottom: 1px solid #000;
}

#top > .contents{
                 background-image: url(../images/dotted_bg01.png);
                 background-position-x: center;
                 background-repeat: repeat-y;
}

/* ============= Top Strength Section =============== */

#top_strengths{
               padding-bottom: 50px;
}

#top_strengths h2{
                  padding-top: 5rem;
}

#top_strengths > .strength-container-box{
                                         width: 100%;
                                         margin: auto;
                                         background-color: #00AF56;
                                         padding-bottom: 50px;
}

#top_strengths > .strength-container-box > .strength-container > h3{
                                                                    top: -55px;
                                                                    position: relative;
                                                                    font-size: 4.3rem;
                                                                    font-weight: bold;
                                                                    display: -webkit-box;
                                                                    background: linear-gradient(#00AF56 50%, #ffffff 50%);
                                                                    -webkit-background-clip: text;
                                                                    -webkit-text-fill-color: transparent;
                                                                     white-space: nowrap;
}

#top_strengths > .strength-container-box > .strength-container{
                                                               width: 50%;
                                                               margin: auto;
}

#top_strengths > .strength-container-box > .strength-container > p{
                                                                   color: #fff;
                                                                   font-size: 18px;
}

#top_strengths > .strength-container-box > .strength-container > p > span.strengthspandesign{
                                                                                             font-size: 25px;
                                                                                             color: #e3e3e3;
                                                                                             font-weight: bold;
}

#top_strengths > .strength-container-box > .strength-container > p.margintop{
                                                                             margin-top: 15px;
                                                                             margin-bottom: 15px;
}

/*
#top_strengths > .top_down{
                           width: 1100px;
                           margin: auto;
                           position: relative;
                           background-color: #00AF56;
}

#top_strengths > .top_down > p{
                               top: -55px;
                               margin:auto;
                               font-size: 4.3rem;
                               font-weight: bold;
                               display: -webkit-box;
                               position: absolute;
                               /*display: inline-block;
                               background: linear-gradient(#00AF56 50%, #ffffff 50%);
                               -webkit-background-clip: text;
                               -webkit-text-fill-color: transparent;
                                white-space: nowrap;
}

#top_strengths > .top_down > img{
                                 width: 35rem;
                                 height: 28rem;
                                 position: absolute;
                                 top: -35px;
                                 right: 0;
}

#top_strengths > div:last-of-type{
                                  height: 530px;
                                  /*background: linear-gradient(#00AF56 85%, #ffffff 15%);
                                  background: linear-gradient(#00AF56 85%, rgba(255, 255, 255, 0) 15%);
}

#top_strengths > div:last-of-type > div{
                                        width: 1100px;
                                        margin: auto;
                                        padding: 50px 0;
                                        color: #ffffff;
}

#top_strengths > div:last-of-type > div > p{
                                            width: 32rem;
                                            color: #fff;
                                            font-size: 17px;
}

#top_strengths > div:last-of-type > div > p.margintop{
                                                      margin-top: 12px;
                                                      margin-bottom: 12px;
                                                      color: #fff;
}
*/

/* ================ Top Service Section ==================== */

#top_service{
             width: 1100px;
             margin: auto;
             margin-bottom: 8rem!important;
}
 
#top_service > #top_service_child01,
#top_service > #top_service_child02{
                                    display: flex;
                                    position: relative;
                                    margin-bottom: 4rem;
}

#top_service > #top_service_child01 > div:first-of-type > img,
#top_service > #top_service_child02 > div:last-of-type > img{
                                                             width: 55rem;
}

#top_service > #top_service_child01 > div:first-of-type > div,
#top_service > #top_service_child02 > div:last-of-type > div{
                                                             z-index: 1;
                                                             color: #fff;
                                                             position: absolute;
                                                             width: 23rem;
                                                             height: 6rem;
                                                             text-align: center;
                                                             font-size: 1.8rem;
                                                             bottom: 0;
}

#top_service > #top_service_child01 > div:first-of-type > div{
                                                              left: 38rem;
}

#top_service > #top_service_child02 > div:last-of-type > div{
                                                             right: 38rem;
}

#top_service > #top_service_child01 > div:first-of-type > div > a,
#top_service > #top_service_child02 > div:last-of-type > div > a{
                                                                 display: block;
                                                                 color: #fff;
                                                                 background-color: #00AF56;
                                                                 width: 100%;
                                                                 /*height: 100%;*/
                                                                 padding: 1.5rem 0;
                                                                 border: solid 1px #00AF56;
}

#top_service > #top_service_child02 > div:last-of-type > div > a{
                                                                 padding: .5rem 0;
}

#top_service > #top_service_child01 > div:first-of-type > div > a:hover,
#top_service > #top_service_child02 > div:last-of-type > div > a:hover{
                                                                       background-color: #fff;
                                                                       color:#00AF56;
                                                                       text-decoration: none;
}

#top_service > #top_service_child01 > div:last-of-type,
#top_service > #top_service_child02 > div:first-of-type{
                                                        position: relative;
                                                        width: 100%;
}

#top_service > #top_service_child01 > div:last-of-type > p,
#top_service > #top_service_child02 > div:first-of-type > p{
                                                            position: absolute;
                                                            color: #D4FDED;
                                                            font-size: 4.3rem;
                                                            font-weight: bold;
                                                            writing-mode: vertical-rl;
                                                           -webkit-writing-mode: vertical-rl;
}

#top_service > #top_service_child01 > div:last-of-type > p{
                                                           right: 0;
}

#top_service > #top_service_child02 > div:first-of-type > p{
                                                            left: 0;
}

/* ================== Top Works Section =================== */

#top_works{
           width: 100%;
           max-width: 1100px;
           margin: auto;
}

#top_works > div:first-of-type{
                             display: flex;
                             position: relative;
                             height: 8rem;
}

#top_works > div:first-of-type > h2{
                                     position:absolute;
                                     top: 2.4rem;
                                     left: 8rem;
}

#top_works > div:first-of-type > p{
                                   position: absolute;
                                   right: 0;
                                   color: #D4FDED;
                                   font-size: 4.3rem;
                                   font-weight: bold;
}

#top_works > ul{
                display: flex;
                flex-wrap: wrap;
                margin: 0 auto 5rem;
}


#top_works > ul > li{
                     width: 21.9rem;
                     min-height: 270px;
                     background-color: #fff;
                     margin-right: 1.5rem;
                     margin-bottom: 1.8rem;
                     align-items: stretch;
}

#top_works > ul > li > a{
                         color: #00AF56;
                         display: block;
                         font-size: 1.5rem;
                         font-weight: bold;
                         width: 21.9rem;
                         height: 270px;
                         text-align: center;
                         background-color: #cccccc;
                         position: relative;
}

#top_works > ul > li > a > img{
                               width: 21.9rem;
                               height: 270px;
}

#top_works > ul > li:nth-of-type(3n){
                                     margin-right: 0;
}

#top_works > ul > li > a:hover{
                               opacity: .8;
}

#top_works > ul > li > a > p{
                             width: 100%;
                             background-color: rgba(255, 255, 255, 0.9);
                             position: absolute;
                             bottom: 0;
                             padding: 1rem 0;
                             font-size: 18px;
}

/* ==================== Top News Section ==================== */

#top_news{
          background-image: url(../images/top_news.png);
          background-size: contain;
          background-repeat: no-repeat;
          background-position: center;
          margin-bottom: 0!important;
}

#top_news h2{
             margin-bottom: 20px;
}

#top_news > div{
                background-color: rgba(0, 175, 85, 0.1);
                padding: 3rem 0 5rem;
}

#top_news > div > ul{
                     /*width: 990px;*/
                     max-width: 1100px;
                     margin: auto;
}

#top_news > div > ul > li{
                          border-bottom: 1px solid #000;
                          padding: 2rem;
                          display: flex;
}

#top_news > div > ul > li > p.lefttext{
                                      padding: 20px;
                                      color: #000;
}

#top_news > div > ul > li > p.righttext{
                                      padding: 20px;
                                      color: #00AF56;
}

#top_news > div > ul > li > .righttext > .alinkdesign{
                                                      font-size: 16px;
                                                      float: right;
                                                      margin-top: 20px;
                                                      text-decoration: none; 
}

/*====================================
    PAGES GENERAL
====================================*/

#sub_image{
           width: 100%;
           /*height: 400px;*/
           background-image: url(../images/footer_contact.png);
           /*background-size: contain;*/
           background-size: cover;
           background-repeat: no-repeat;
           background-position: center;
}

#sub_image h1{
              font-size: 2.4rem;
}

#sub_image h1.ownstyle{
                       font-size: 2.1rem;
}

#sub_image > div{
                 background: linear-gradient(45deg, rgba(0, 175, 85, 0.2),rgba(0, 175, 85, 0.7));
                 padding: 6rem 0 6rem;
                 text-align: center;
                 color: #fff;
}

#sub_image > div > p {
                      font-size: 1.5rem;
}

#breadclumbs{
             width: 100%;
             background-color: #00AF56;
             color: #fff;
             margin-bottom: 3rem;
}

#breadclumbs > div{
                   width: 1100px;
                   margin: auto;
                   display: flex;
                   padding: .7rem;
}

#breadclumbs > div > a{
                       color: #fff;
}

#breadclumbs > div > a:hover{
                             text-decoration: underline;
}

#breadclumbs > div > *{
                       padding: 0 1rem;
                       font-size: 18px;
}

.sub_page > .contents{
                      /* background-image: url(../images/dotted_bg03.png);*/
                      background-position-x: center;
                      background-repeat: repeat-y;
                      width: 100%;
                      max-width: 1100px;
}

.sub_page > .contents > .heading_area{
                                      display: flex;
                                      position: relative;
                                      height: 8rem;
}

.sub_page > .contents > .heading_area > h2{
                                           position: absolute;
                                           left: 0rem;
                                           font-size: 2rem;
                                           top: 1.8rem;
                                           z-index: 1;
}

.sub_page > .contents > .heading_area > h2::after{
                                                  content: '';
                                                  display: block;
                                                  width: 6rem;
                                                  margin: auto;
                                                  padding-top: 5px;
                                                  border-bottom: 1px solid #000;
}

.sub_page > .contents > .heading_area > p{
                                         position: absolute;
                                         right: 0;
                                         color: #D4FDED;
                                         font-size: 4.3rem;
                                         font-weight: bold;
}

/*====================================
    ACHIEVEMENT
====================================*/

#achievement > .contents > section:nth-of-type(1){
                                                  background-color: #fff;
                                                  border: 3px solid #00AF56;
                                                  width: 900px;
                                                  padding: 2rem;
                                                  margin: 0 auto 3rem auto;
}

#achievement > .contents > ul{
                              display: flex;
                              flex-wrap: wrap;
                              margin: 0 auto 5rem;
}

#achievement > .contents > ul > li{
                                   width: 22.1rem;
                                   min-height: 250px;
                                   background-color: #fff;
                                   margin-right: 1.2rem;
                                   margin-bottom: 2rem;
}

#achievement > .contents > ul > li > a{
                                       color: #00AF56;
                                       display: block;
                                       font-size: 1.5rem;
                                       width: 22.1rem;
                                       height: 250px;
                                       text-align: center;
                                       background-color: #cccccc;
                                       position: relative;
                                       text-decoration: none;
}

#achievement > .contents > ul > li > a > img{
                                             width: 22.1rem;
                                             height: 250px;
                                             position: relative;
}

#achievement > .contents > ul > li:nth-of-type(3n){
                                                   margin-right: 0;
}

#achievement > .contents > ul > li > a:hover{
                                             opacity: .8;
}

#achievement > .contents > ul > li > a > p{
                                           width: 100%;
                                           background-color: rgba(255, 255, 255, 0.9);
                                           position: absolute;
                                           bottom: 0;
                                           padding: 1rem 0.5rem;
                                           font-size: 18px;
}

/* ================ css of achievement details page ==================== */

#achievement_details > .contents > section:nth-of-type(2){
                                                          margin-left: 0rem;
                                                          margin-bottom: 4rem;
}

#achievement_details > .contents > ul{
                                      display: flex;
                                      flex-wrap: wrap;
                                      margin: 0 auto 5rem;
}

#achievement_details > .contents > ul > li{
                                           width: 19.1rem;
                                           /*padding: 2rem; */
                                           padding: 1rem 1.5rem 2rem;
                                           /* height: 13rem; */
                                           min-height: 290px;
                                           text-align: center;
                                           background-color: #32BE77;
                                           color:#fff;
                                           margin-right: 1.2rem;
                                           margin-bottom: 1.6rem;
                                           align-items: stretch;
                                           filter: drop-shadow(0 0 0.4rem rgba(0, 0, 0, 0.3));
}

#achievement_details > .contents > ul > li:nth-of-type(3n){
                                                           margin-right: 0;
}

#achievement_details > .contents > ul > li:nth-of-type(2n){
                                                           background-color: #fff;
                                                           color:#32BE77;
}


#achievement_details > .contents > ul > li:nth-of-type(2n) > div:nth-of-type(1){
                                                                                border-bottom: 1px solid #32BE77;
}

#achievement_details > .contents > ul > li > div > p{
                                                     display: table-cell;
                                                     vertical-align: middle;
                                                     font-size: 16px;
}

#achievement_details > .contents > ul > li > div:nth-of-type(1){
                                                                border-bottom: 1px solid #fff;
}

#achievement_details > .contents > ul > li > div:nth-of-type(2) {
                                                                 margin-top: 15px;
}

#achievement_details > .contents > ul > li > div:first-child{
                                                             width: 100%;
                                                             height: 32%;
                                                             padding: 5px;
                                                             display: table;
                                                             text-align: center;
}

#achievement_details > .contents > ul > li > div:last-child{
                                                              width: 100%;
                                                              height: auto;
                                                              padding: 5px;
                                                              display: table;
                                                              text-align: center;
}

#achievement_details > .contents > ul > li > div:first-child > p{
                                                                 font-size: 18px;
}

#achievement_details > .contents > ul > li > div:last-child > p{
                                                                font-size: 16px;
}

/* ==================== css of System achievement page ==================== */

.sub_page > .contents > .heading_area1{
                                       position: relative;
                                       display: flex;
                                       height: 8rem;
}

.sub_page > .contents > .heading_area1 > h2{
                                            position: absolute;
                                            left: 5rem;
                                            font-size: 2rem;
                                            top: 1.8rem;
                                            z-index: 1;
}

.sub_page > .contents > .heading_area1 > h2::after{
                                                   content: '';
                                                   display: block;
                                                   width: 6rem;
                                                   margin: auto;
                                                   border-bottom: 1px solid #000;
}

.sub_page > .contents > .heading_area1 > p{
                                           position: absolute;
                                           right: 0;
                                           color: #D4FDED;
                                           font-size: 4.3rem;
                                           font-weight: bold;
}

.custom-content{
                margin-bottom: 50px!important;
                text-align: center;
               
}

.custom-content h2{
                   color: #00AF56;
                   padding-bottom: 15px;
}

.custom-content h2::after{
                          content: '';
                          display: block;
                          width: 11rem;
                          margin: auto;
                          padding-top: 10px;
                          border-bottom: 1px solid #00AF56;
}

.custom-content .programming-language,
.custom-content .framework{
                           padding-bottom: 20px;
}

.custom-content .programming-language h3,
.custom-content .framework h3,
.custom-content .environment-construction h3{
                                             font-size: 15px;
}

.custom-content .programming-language p,
.custom-content .framework p,
.custom-content .environment-construction p{
                                            font-size: 15px;
}

.custom-content1{
                 margin-bottom: 20px;
                 margin: auto;
                 width: 70%;
                 text-align: center;
}

.custom-content1 h2{
                    color: #00AF56;
                    padding-bottom: 15px;
}

.custom-content1 h2::after{
                           content: '';
                           display: block;
                           width: 11rem;
                           margin: auto;
                           padding-top: 10px;
                           margin-bottom: 20px;
                           border-bottom: 1px solid #00AF56;
}

.custom-content1 .programming-language,
.custom-content1 .framework,
.custom-content1 .environment-construction{
                                           background-color: #00AF56;
                                           padding: 20px;
                                           margin-bottom: 5px;
}

.custom-content1 .bracketdiv:after {
                                    content: '';
                                    display: block;
                                    width: 0; /* Set width to 0 for a triangular shape */
                                    height: 0; /* Set height to 0 for a triangular shape */
                                    border-left: 50px solid transparent; /* Create left side of the triangle */
                                    border-right: 50px solid transparent; /* Create right side of the triangle */
                                    border-top: 30px solid #00AF56; /* Create the dropdown shape */
                                    margin: auto;
                                    margin-top: 15px;
                                    margin-bottom: 15px;
}

.custom-content1 .programming-language h3,
.custom-content1 .framework h3,
.custom-content1 .environment-construction h3{
                                             font-size: 18px;
                                             color:#fff;
                                             padding-bottom: 8px;
}

.custom-content1 .programming-language h3::after,
.custom-content1 .framework h3::after,
.custom-content1 .environment-construction h3::after{
                                                     content: '';
                                                     display: block;
                                                     width: 11rem;
                                                     margin: auto;
                                                     padding-top: 10px;
                                                     border-bottom: 1px solid rgb(238, 225, 225);
}

.custom-content1 .programming-language p,
.custom-content1 .framework p,
.custom-content1 .environment-construction p{
                                             font-size: 15px;
                                             color: #fff;
}

.custom-content2{
                 margin-bottom: 20px;
                 margin: auto;
                 text-align: center;
                 margin-top: 60px;
                 position: relative;
                 width: 90%;
                 padding: 20px;  /* Adjust padding as needed */
} 

.custom-content2 > h2 > span.spansystemdesign{
                                              font-size: 18px;
}

.custom-content2 h2{
                    color: #00AF56;
                    padding-bottom: 15px;
}

.custom-content2 h2::after{
                           content: '';
                           display: block;
                           width: 11rem;
                           margin: auto;
                           padding-top: 10px;
                           margin-bottom: 20px;
                           border-bottom: 1px solid #00AF56;
}

.custom-content3{
                 margin-bottom: 20px;
                 margin: auto;
                 text-align: center;
                 margin-top: -60px;
                 position: relative;
                 width: 90%;
                 padding: 10px; 
                 padding-top: 0px;
                 margin-bottom: 35px;
}

.custom-content3 p{
                   color: #000;
                   padding-bottom: 20px;
                   text-align: right;
                   font-size: 16px;
}

.system_achievement_container{
                              width: 90%;
                              margin: auto;
}

.image-div {
            position: relative;
            width: 100%;
            margin: auto;
            margin-bottom: 40px;
}

.image-box, .image-box1, .image-box2,
.image-box3, .image-box4, .image-box5,
.image-box6, .image-box7, .image-box8,
.image-box9, .image-box10{
                          background-size: cover;
                          background-position: center;
                          width: 100%;
                          height: 400px; /* Adjust height as needed */
                          position: relative; /* Ensure the .text-overlay is positioned relative to this container */
}

.image-box {
            background-image: url('../images/system_achievement/system_achievement01.jpg'); /* Replace with your image URL */
   
}

.image-box1{
            background-image: url('../images/system_achievement/system_achievement02.jpg'); /* Replace with your image URL */
}

.image-box2{
            background-image: url('../images/system_achievement/system_achievement03.jpg'); /* Replace with your image URL */
}

.image-box3{
            background-image: url('../images/system_achievement/system_achievement04.jpg'); /* Replace with your image URL */
}

.image-box4{
            background-image: url('../images/system_achievement/system_achievement05.jpg'); /* Replace with your image URL */
}

.image-box5{
            background-image: url('../images/system_achievement/system_achievement06.jpg'); /* Replace with your image URL */
}

.image-box6{
            background-image: url('../images/system_achievement/system_achievement07.png'); /* Replace with your image URL */
}

.image-box7{
            background-image: url('../images/system_achievement/system_achievement08.jpg'); /* Replace with your image URL */
}

.image-box8{
            background-image: url('../images/system_achievement/system_achievement09.png'); /* Replace with your image URL */
}

.image-box9{
            background-image: url('../images/system_achievement/system_achievement10.jpg'); /* Replace with your image URL */
}

.image-box10{
             background-image: url('../images/system_achievement/system_achievement11.jpg'); /* Replace with your image URL */
}

.text-overlay {
               position: absolute;
               top: 0;
               right: 0;
               width: 100%; /* Adjust width as needed */
               height: 100%;
               background: rgba(0, 0, 0, 0.5); /* Semi-transparent background */
               color: white; /* Adjust text color as needed */
               text-align: right; /* Align text to the right */
               display: flex;
               flex-direction: column;
               padding: 20px; /* Adjust padding as needed */
               box-sizing: border-box; /* Ensure padding does not affect the element size */
}

.custom-content2 h3{
                    font-size: 26px;
                    padding-top: 50px;
                    padding-right: 5%;
                    margin-bottom: 20px;
}
.custom-content2 p{
                   font-size: 18px;
                   margin-right: 5%;
                   width: 77%;
                   margin-left: 18%;
}



/*------ css of company profile page ------- */

.company-headerfirst,
.company-headersecond{
                      font-size: 25px;
                      color: #000;
                      padding-left: 30px;
}

.my-line{
         border: 0;
         height: 3px;
         background: #00AF56;
         margin-bottom: 30px;
         margin-top: 5px;
         width: 4rem;
}

hr.company-line,
hr.company-secondline{
                      border: 0;
                      height: 3px;
                      background: #00AF56;
                      margin-bottom:30px;
                      margin-top: 5px;
                      width: 4rem;
}

hr.company-line {
                 margin-left: 45px;
}

hr.company-secondline{
                      margin-left: 47px;
}

.image-box-container{
                     padding-left: 50px;
                     margin-bottom: 70px;
}

.image-box-container > .group-imagebox{
                                       display: flex;
                                       margin-bottom: 10px;
}


.image-box-container > .group-imagebox > .companyimage1,
.image-box-container > .group-imagebox > .companyimage2{
                                                        text-align: center;

}

.image-box-container > .group-imagebox > .companyimage3{
                                                        padding-top: 10px;
                                                        text-align: center;
}

.image-box-container > .group-imagebox > .companyimage1 > img,
.image-box-container > .group-imagebox > .companyimage2 > img{
                                                              width: 150px;
                                                              height: 135px;           
}

.image-box-container > .group-imagebox > .companyimage3 > img.imagecompanyc{
                                                                            width: 145px;
                                                                            height: 120px;
                                                                            padding-bottom: 5px;
                                                                            padding-left: 20px;
}

.image-box-container > .group-imagebox > .companyimage1 > h3.companyimageheader1,
.image-box-container > .group-imagebox > .companyimage2 > h3.companyimageheader2,
.image-box-container > .group-imagebox > .companyimage3 > h3.companyimageheader3{
                                                                                 font-size: 14px;
                                                                                 color: #00AF56;
}

.image-box-container > .group-image-paragraph > p{
                                                  font-size: 14px;
                                                  color: #00AF56;
                                                  font-weight: bold;
                                                  padding-left: 130px;
}

.company_top,
.company_bottom{
                padding-left: 50px;
}

.company_top p{
               font-size: 18px;
               padding-bottom: 4px;
}

.company_top .mgb30{
                    margin-bottom: 25px;
}

.company-headersecond{
                      margin-top: 70px;
}

.company_bottom table tr{
                         display: table-row;
}

.company_bottom table {
                       border-collapse: collapse; /* Ensures borders don't double */
                       width: 100%; /* Optional: adjust as needed */
}

.company_bottom td {
                    padding: 25px; /* Adjust padding as needed */
                    vertical-align: top;
}

.company_bottom td.widthcss{
                            width: 150px;
}

/* Add a bottom border to each row except the last one */
.company_bottom tr:not(:last-child) {
                                     border-bottom: 1px solid gray; /* Adjust color and thickness */
}

.company_bottom td p{
                     font-size: 16px;
                     padding-bottom: 3px;
}

.company_bottom td p.mgb30{
                           margin-bottom: 20px;
}

.company_bottom{
                margin-bottom: 30px;
}

/*----- style of SDGs -----*/

.SDGs-headerfirst,
.SDGs-headersecond,
.SDGs-headerthird{
                  font-size: 25px;
                  color: #000;
                  padding-left: 30px;
}

hr.SDGs-line,
hr.SDGs-secondline{
                   border: 0;
                   height: 3px;
                   background: #00AF56;
                   margin-bottom:30px;
                   margin-top: 5px;
                   width: 6rem;
}

hr.SDGs-line{
             margin-left: 185px;
}

hr.SDGs-secondline{
                   margin-left: 160px;
}

.image-container {
                  display: flex;                /* Enable flexbox */
                  justify-content: center;      /* Center horizontally */
                  align-items: center;          /* Center vertically */
                  height: 350px;                /* Set height of the container */
                  overflow: hidden;             /* Hide overflow if the image is larger */
}

.image-container img {
                      max-width: 100%;              /* Ensure the image fits within the container */
                      max-height: 100%;             /* Maintain image within the height */
                      height: auto;                 /* Maintain aspect ratio */
}

.SDGs_top{
          padding-left: 40px;
          margin-top: 15px;
}

.SDGs_top p{
            font-size: 16px;
}

.SDGs-headersecond{
                   margin-top: 70px;
}

.second-container{
                  display: flex;                /* Enable flexbox layout */
                  align-items: center;          /* Center items vertically */
                  margin-top: 50px;
                  margin-bottom: 45px;
}

.second-container .image{
                         width: 400px;                 /* Set the width of the image */
                         height: auto;                 /* Maintain aspect ratio */
                         margin-right: 20px;  
                         margin-left: 40px;         /* Space between image and description */
}

.second-container .image-description{
                                     margin-left: 50px;
}

.second-container .image-description a{
                                       color: #00AF56;
}

.third-container{
                 display: flex;
                 align-items: center;
                 margin-top: 50px;
                 margin-bottom: 45px;
}

.third-container .image-second{
                               width: 400px;
                               height: auto;
                               margin-right: 20px;
                               margin-left: 10%;
}

.third-container .image-description{
                                    margin-left: 165px;
}

.third-container .image-description a{
                                     color:#00AF56;
}

.fourth-container{
                   width: 100%;
}

.fourth-container .image-third{
                                width: 60%;
                                margin-left: 20%;
}

.fifth-container{
                 display: flex;  
                 margin-top: 50px;
                 margin-bottom: 65px;
}

.fifth-container .image-fourth{
                               width:250px;
                               height: auto;
}

.fifth-container .image-description{
                                    padding-left: 50px;  
}

.fifth-container .image-description h2{
                                       font-size: 20px;
}

.fifth-container .image-description h3, p{
                                          font-size: 16px;
}

.fifth-container .my-lastline {
                               border: 0; /* Remove default border */
                               height: 3px; /* Line thickness */
                               background: #00AF56; /* Line color */
                               margin-bottom: 10px;
                               margin-top: 5px;
}

/*------ Css style of Greeting page -------*/

.greeting-header{
                 font-size: 28px;
                 color: #000;
                 padding-left: 30px;
}

hr.greeting-line{
                 border: 0;
                 height: 3px;
                 background: #00AF56;
                 margin-bottom:30px;
                 margin-top: 5px;
                 width: 4rem;
                 margin-left: 70px;
}

.history{
         padding-left: 30px;
         margin-bottom: 100px;
}

.history p{
           font-size: 22px;
}

.history p.mgt30{
                margin-top: 30px;
}

.history p.mgt30style{
                       margin-top: 30px;
                       text-align: right; 
                       margin-bottom: 70px;
}

/*------- css style of History Page ---------*/

.history-header{
                font-size: 28px;
                color: #000;
                padding-left: 30px;
}

hr.history-line{
                border: 0;
                height: 3px;
                background: #00AF56;
                margin-bottom:30px;
                margin-top: 5px;
                width: 2rem;
                margin-left: 42.5px;
}

hr.news-line{
             border: 0;
             height: 3px;
             background: #00AF56;
             margin-bottom:30px;
             margin-top: 5px;
             width: 3rem;
             margin-left: 60.5px;
}

.history-container{
                   padding-left: 30px;
                   margin-bottom: 100px;
}

.history-container .upper-paragraph{
                                    margin-bottom: 30px;
                                    font-size: 22px;
}

.history-container .table td.historytdwidth{
                                            width: 100px;
}

.history-container .table td{
                             vertical-align: top;
}

.history-container .table .paradesign{
                                      padding-left: 70px;
                                      padding-bottom: 5px;
}

.history-container .table .paradesigntext{
                                      color: #00AF56;
}

/*============ Css of questionaire page ===============*/

.questionaire-header{
                     font-size: 28px;
                     color: #000;
                     padding-left: 30px;
}

hr.questionaire-line{
                     border: 0;
                     height: 3px;
                     background: #00AF56;
                     margin-bottom:30px;
                     margin-top: 5px;
                     width: 5rem;
                     margin-left: 90px;
}

.questionaire-container{
                        padding-left: 30px;
                        margin-bottom: 100px;
}

.questionaire-container .tabs {
                               list-style-type: none; /* Remove default list styling */
                               padding: 0;
                               display: flex;
                               margin-bottom: 40px;
                               margin-left: 60px;
}

.questionaire-container .tabs li {
                                  margin-right: 5px; /* Space between tabs */
}

.questionaire-container .tab-link {
                                   padding: 10px;
                                   text-decoration: none;
                                   color: #fff;
                                   background-color: #00AF56;
                                   border: 1px solid transparent;
}

.questionaire-container .tab-link.active {
                                          background-color: #009436;
                                          border-bottom: 1px solid white; /* To match content border */ /* To match content border */
}

.questionaire-container .tab-content {
                                      display: none;
                                      padding: 20px;
}

.questionaire-container .tab-content h2{
                                        font-weight: bold;
                                        font-size: 18px;
                                        padding-bottom: 30px;
}

.questionaire-container .tab-content.active {
                                             display: block;
}

.questionaire-container .tab-content .fontdesign{
                                                 font-size: 32px;
                                                 color: #00AF56;
                                                 padding-right: 20px;
                                                 vertical-align: top;
}

.questionaire-container table td{
                                 padding-top: 17px;
}

.questionaire-container table tr td:first-child{
                                                vertical-align: top;
                                                padding-top: 0;
}

.questionaire-container table .lastpara{
                                        margin-bottom: 40px;
}

.questionaire-container table p{
                                font-size: 16px;
}

/* ============ Css of price page ================= */

.price-header{
              font-size: 28px;
              color: #000;
              padding-left: 20px;
}

hr.price-line{
              border: 0;
              height: 3px;
              background: #00AF56;
              margin-bottom:30px;
              margin-top: 5px;
              width: 2.8rem;
              margin-left: 41px;
}

.price-container{
                 padding-left: 30px;
                 padding-right: 30px;
                 margin-bottom: 80px;
}

.price-container .tabs{
                       width: 100%;
                       display: flex;
                       flex-wrap: wrap;
                       text-align: center;
                       margin-bottom: 30px;
}

.price-container .tabs li{
                           margin: 10px 10px;
                           margin-bottom: 20px;
}

.price-container .tab-link {
                            width: 200px;
                            padding: 10px;
                            text-decoration: none;
                            color: #fff;
                            background-color: #00AF56;
                            border: 1px solid transparent;
}

.price-container .tab-link:nth-last-child(-n+1) {
                                                 width: 270px;
   
}

.price-container .tab-link.active {
                                   background-color: #009436;
                                   border-bottom: 1px solid white; /* To match content border */
}

.price-container .tab-content {
                               display: none;
                               padding: 20px;
}

.price-container .tab-content.active {
                                      display: block;
}

.price-container .header3{
                          font-size: 18px;
                          font-weight: bold;
                          margin-bottom: 30px;
}

.price-container .header4{
                          font-size: 18px;
                          font-weight: bold;
                          margin-top: 30px;
}

.price-container table tr th,
.price-container table tr td{
                             padding: 1px 5px;
}

.price-container .tab-content p{
                               font-size: 15px;
}

.price-container h3.designmeasbutton,
.price-container h3.designmeasbutton3{
                                      background-color: #00AF56;
                                      padding: 2px 10px;
                                      width: 150px;
                                      color: #fff;
                                      font-size: 16px;
                                      font-weight: 500;
                                      margin-top: 100px;
                                      margin-bottom: 15px;
}

.price-container h3.designmeasbutton3{
                                      margin-top: 20px;
}

.price-container .table1{
                         width: 100%;
                         margin-bottom: 30px;
}

.price-container .table1 th{
                            background-color: #00AF56;
                            color: #fff;
                            font-size: 14px;
                            text-align: center;
}

.price-container .table1 th.borderright,
.price-container .table2 th.borderright,
.price-container .table3 th.borderright,
.price-container .table4 th.borderright,
.price-container .table5 th.borderright{
                                        border-right: 2px solid #fff;
}

.price-container .table4 th.borderbottom{
                                          border-bottom: 2px solid #fff;
} 

.price-container .table1 td{
                            color: #00AF56; 
                            font-size: 14px;
                            text-align: center;
}

.price-container .table2{
                         width: 30%;
                         margin-right: 20px;
}

.price-container .table2 th{
                            background-color: #00AF56;
                            color: #fff;
                            font-size: 14px;
                            text-align: center;
}

.price-container .table2 td{
                            color: #00AF56; 
                            font-size: 14px;
                            text-align: center;
}

.price-container #Tab2 .table-box-container{
                                            display: flex;
}

.price-container .table3{
                         width: 60%;
}

.price-container .table3 th{
                            background-color: #00AF56;
                            color: #fff;
                            font-size: 14px;
                            text-align: center;
}

.price-container .table3 td{
                            color: #00AF56; 
                            font-size: 14px;
                            text-align: center;
}

.price-container #Tab2 .table-box-container{
                                            display: flex;
}

.price-container .table4{
                         width: 70%; 
                         margin-bottom: 30px;
}

.price-container .table4 th{
                            background-color: #00AF56;
                            color: #fff;
                            font-size: 14px;
                            text-align: center;
}

.price-container .table4 td{
                            color: #00AF56; 
                            font-size: 14px;
                            text-align: center;
}

.price-container .table5{
                         width: 70%;
}

.price-container .table55{
                          width: 90%;
                          margin-top: 20px;
                          margin-bottom: 20px;
}

.price-container .table5 th,
.price-container .table55 th{
                             background-color: #00AF56;
                             color: #fff;
                             font-size: 14px;
                             text-align: center;
}

.price-container .table5 td,
.price-container .table55 td{
                             color: #00AF56; 
                             font-size: 14px;
                             text-align: center;
}

.price-container .last-para{
                            margin-top: 30px;
}

/* ============ Css of access page ================ */

.access-header{
               font-size: 28px;
               color: #000;
               padding-left: 30px;
}

hr.access-line{
               border: 0;
               height: 3px;
               background: #00AF56;
               margin-bottom:30px;
               margin-top: 5px;
               width: 3.7rem;
               margin-left: 57px;
}

.access-container{
                  padding-left: 30px;
                  margin-bottom: 100px;
}

.access-container .first-access-div,
.access-container .second-access-div{
                                     margin-bottom: 40px;
}
.access-container .third-access-div{
                                    width: 80%;
                                    margin: auto;
}
.access-container .third-access-div iframe{
                                           width: 100%;
                                          
}

/* ============ css of recruit page ============ */

.recruit-header{
                font-size: 28px;
                color: #000;
                padding-left: 30px;
}

hr.recruiter-line{
                  border: 0;
                  height: 3px;
                  background: #00AF56;
                  margin-bottom:30px;
                  margin-top: 5px;
                  width: 15rem;
                  margin-left: 245px;
}

.recruit-container{
                   padding-left: 30px;
                   padding-right: 30px;
                   margin-bottom: 100px;
}

.recruit-container ul li a{
                           font-size: 20px;
                           color:#00AF56;
}

.recruit-container ul li a:hover{
                                 list-style: none;
}

#seisaku_director{
                  margin-top: 100px;
                  margin-bottom: 70px;
}

#chosa_assistant{
                 margin-top: 100px;
                 margin-bottom: 70px;
}

#seisaku_director h2,
#chosa_assistant h2,
#system-engineer h2{
                     padding-left: 30px;
}

.recruit-line {
               border: 0; /* Remove default border */
               height: 3px; /* Line thickness */
               background: #00AF56; /* Line color */
               margin-bottom: 30px;
               margin-top: 5px;
               margin-right: 20px;
}

#seisaku_director .seisaku-container p,
#chosa_assistant .chosa-container p,
#system_engineer .system-container p{
                                     padding-bottom: 5px;
}

#seisaku_director .seisaku-container p.mgb20,
#chosa_assistant .chosa-container p.mgb20,
#system_engineer .system-container p.mgb20{
                                           padding-bottom: 20px;
}

#seisaku_director .seisaku-container p.pr20{
                                            padding-left: 15px;
}

/* ============== Css of Marutto page =============== */

.marutto-header{
                font-size: 28px;
                color: #000;
                padding-left: 30px;
}


hr.marutto-line{
                border: 0;
                height: 3px;
                background: #00AF56;
                margin-bottom:30px;
                margin-top: 5px;
                width: 6rem;
                margin-left: 145px;
}

.marutto-container{
                   padding-left: 30px;
                   padding-right: 30px;
                   margin-bottom: 100px;
}

.marutto-image-container {
                          display: flex;
                          flex-wrap: wrap; /* Allows multiple rows */
                          justify-content: space-between;
                          gap: 10px;
                          margin-top: 50px;
}    

.marutto-image-item {
                    text-align: center;
                    width: calc(25% - 10px); /* 4 images in a row with spacing */
                    margin-bottom: 50px; /* Space between rows */
}

.marutto-image-item img{
                        width: 92%; /* Make image take full width of the container */
                        height: auto; /* Set a fixed height */
                        object-fit: cover; /* Maintain aspect ratio and cover the space */
}

.marutto-image-item:hover {
                           opacity: 0.8; /* Optional: add hover effect */
}

.marutto-image-container .marutto-image-item p{
                                               color: #00AF56;
}

.marutto-image-container .marutto-image-item p:hover{
                                                     text-decoration: underline;
}

/* ===== Css of privacy01 page ===== */

.privacy01-headerfirst{
                       font-size: 25px;
                       color: #000;
                       padding-left: 30px;
}

hr.privacy-line{
                border: 0;
                height: 3px;
                background: #00AF56;
                margin-bottom:30px;
                margin-top: 5px;
                width: 6rem;
                margin-left: 120px;
}

.privacy01-content{
                   padding-left: 30px;
                   padding-right: 30px;
}

.privacy01-content h3,p{
                        font-size: 16px;
                        font-weight: 500;
}

.privacy01-content table{
                         width: 100%;
}

.privacy01-content table td{
                            border-bottom: 2px solid #009436;
                            padding: 10px;
                            vertical-align: top;
}

.privacy01-content table td.textcenter{
                                       text-align: center;
}

.privacy01-content table td.borderright{
                                        border-right: 2px solid #009436;
}

.privacy01-content table td.borderup{
                                     border-top: 2px solid #009436;
}

.privacy01-content h3.header3{
                              margin-top: 25px;
}

.privacy01-content .paralist1,
.privacy01-content .paralist2{
                              padding-left: 30px;
}

.privacy01-content .paralist1 p.pr20{
                                     padding-left: 15px;
}

.privacy01-content .button-container{
                                     display: flex;
                                     justify-content: center;
                                     margin-top: 30px;
                                     margin-bottom: 100px;
}

.privacy01-content .button-container .button{
                                             width: 200px; /* Set a fixed width for both buttons */
                                             margin: 0 10px; /* Space between buttons */
                                             padding: 15px;
                                             background-color: #009436; /* Button color */
                                             color: white;
                                             text-align: center;
                                             text-decoration: none; /* Remove underline */
                                             cursor: pointer;
                                             font-size: 16px;
}

/*==== css of privacy 02 page ===*/

.privacy02-header{
                  font-size: 25px;
                  color: #000;
                  padding-left: 30px;
}

hr.privacy02-line{
                  border: 0;
                  height: 3px;
                  background: #00AF56;
                  margin-bottom:30px;
                  margin-top: 5px;
                  width: 4rem;
                  margin-left: 95px;
}

.privacy02-content{
                   padding-left: 30px;
                   margin-bottom: 100px;
                   padding-right: 30px;
}

.privacy02-content .textrightdesign{
                                    text-align: right;
}

.privacy02-content h3{
                      text-align: center;
                      font-size: 24px;
                      padding-top: 30px;
                      padding-bottom: 30px;
}

.privacy02-content .smallparagraph{
                                   margin-bottom: 35px;
}

.privacy02-content .paddingtop{
                               padding-top: 20px;
}


.privacy02-content .button-container{
                                     text-align: center;
                                     margin-top: 30px;
}

.privacy02-content .button-container .centered-button {
                                                       display: inline-block;
                                                       padding: 10px 20px;
                                                       font-size: 16px;
                                                       color: white;
                                                       background-color: #009436;
                                                       text-decoration: none;
                                                       transition: background-color 0.3s;
}

/*=== css of privacy03 page ===*/

.privacy03-header{
                  font-size: 25px;
                  color: #000;
                  padding-left: 30px;
}

hr.privacy03-line{
                  border: 0;
                  height: 3px;
                  background: #00AF56;
                  margin-bottom:30px;
                  margin-top: 5px;
                  width: 7rem;
                  margin-left: 136px;
}

.privacy03-content{
                   padding-left: 30px;
                   margin-bottom: 100px;
                   padding-right: 30px;
}

.privacy03-content .privacy03-table{
                                    align-items: center;
                                    width: 70%;
                                    margin: auto;
                                    margin-bottom: 30px;
                                    margin-top: 40px;
}

.privacy03-content .privacy03-table td{
                                       padding: 10px;
}

.privacy03-content .textcenter{
                               text-align: center;
}

.privacy03-content .upd{
                        padding-top: 30px;
}

.privacy03-content h3{
                      font-size: 22px;
}


.privacy03-content .privacy03-table td{
                                       vertical-align: top;
}

.privacy03-content .textright{
                               text-align: right;
                               padding-right: 80px;
}

.privacy03-content .privacy03-table td p.widthdesign{
                                                     width: 180px;
}

.privacy03-content .privacy03-table td.tddesign{
                                                height: 100px;
}

/*==== css of business page =====*/

.business-header{
                 font-size: 25px;
                 color: #000;
                 padding-left: 30px;
}

hr.business-line{
                 border: 0;
                 height: 3px;
                 background: #00AF56;
                 margin-bottom:30px;
                 margin-top: 5px;
                 width: 4rem;
                 margin-left: 190px;
}

.business-container{
                    padding-left: 30px;
                    margin-bottom: 100px;
                    padding-right: 30px;
}

.business-container .business-image-container{
                                              padding-top: 30px;
                                              padding-bottom: 50px;
                                              text-align: center;
}

.business-container .divider{
                             margin-top: 30px;
                             margin-bottom: 30px;
}

.business-container .image-description-box{
                                           display: flex;
}

.business-container .textcolorgreen{
                                    color: #009436;
}

.business-container .image-description-box .image-icon{
                                                       padding-top: 15px;
                                                       text-align: left;
                                                       width: 150px;
}

.business-container .image-description-box .image-icon img{
                                                           height: 150px;
                                                           width: 150px;
}

.business-container .image-description-box .image-icon img.imagebusinessc{
                                                                           height: 133px;
                                                                           width: 150px;
                                                                           padding-left: 11px;
}

.business-container .image-description-box .image-icon .businessheaderdesign{
                                                                             color: #00AF56;
                                                                             margin-top: 10px;
                                                                             font-size: 15px;
                                                                             text-align: center;
}

.business-container .image-description-box .image-icon .businessheaderdesignn{
                                                                             color: #000;
                                                                             font-size: 12px;
                                                                             text-align: center;
}

.business-container .image-icon-description .firstcolumn{
                                                         padding: 10px;
                                                         width: 23%;
}

.business-container .image-icon-description .secondcolumn{
                                                         padding: 10px;
}

.business-container .image-icon-description .thirdcolumn{
                                                         padding: 10px;
}

.business-container table.image-icon-description td{
                                                    vertical-align: top;
}

/* ============= css of contact page ================= */

.contact-headerfirst{
                       font-size: 25px;
                       color: #000;
                       padding-left: 30px;
}

hr.contact-line{
                border: 0;
                height: 3px;
                background: #00AF56;
                margin-bottom:30px;
                margin-top: 5px;
                width: 4rem;
                margin-left: 72px;
}

.contact-content{
                 padding-left: 30px;
                 padding-right: 30px;
                 padding-bottom: 80px;
}

.contact-content .contact-firstcontent{
                                       padding: 5px;
}

.contact-content .contact-firstcontent .paraup{
                                               padding-top: 20px;
}

.contact-content .contact-secondcontent .first-table{
                                                     width: 62%;
                                                     margin: auto;
                                                     margin-top: 20px;
                                                     margin-bottom: 20px;
}

.contact-content .contact-secondcontent .first-table td{
                                                        color: #fff;
                                                        padding-left: 10px;
                                                        background-color: #009436;
}

.contact-content .contact-secondcontent .first-table td.differenttd{
                                                                   background-color: #d3e9db;
                                                                   padding: 5px;
}

.contact-content .contact-secondcontent .first-table td input{
                                                              background-color: #d3e9db;
                                                              width: 97%;
                                                              padding: 5px;
                                                              border: none;
}

.contact-content .contact-secondcontent .first-table td input:focus{
                                                                    background-color: #c1e6d0;
                                                                    outline: 0;
}

.contact-content .contact-secondcontent .first-table td textarea{
                                                                 background-color: #d3e9db;
                                                                 padding: 5px;
                                                                 border: none;
}

.contact-content .contact-secondcontent .first-table td textarea:focus{
                                                                       background-color: #c1e6d0;
                                                                       outline: 0;
}

.contact-content .contact-secondcontent .contact-innercontent{
                                                              text-align: center;
                                                              padding-top: 10px;
                                                              padding-bottom: 10px;
                                                              margin-bottom: 20px;
}

.contact-content .contact-secondcontent .second-table{
                                                      width: 62%;
                                                      margin: auto;
}


.contact-content .contact-secondcontent .second-table th,
.contact-content .contact-secondcontent .second-table td{
                                                         padding: 10px;
                                                         background-color: #d3e9db;
}

.contact-content .contact-secondcontent .second-table th{
                                                       width: 30px;
                                                       text-align: left;
                                                       vertical-align: top;
                                                       padding: 10px;
                                                       
}

.contact-content .contact-secondcontent .second-table td p:first-child,
.contact-content .contact-secondcontent .second-table th p,
.contact-content .contact-secondcontent .lower-contentsection p:first-child{
                                                                            font-weight: bold;
}

.contact-content .contact-secondcontent .lower-contentsection{
                                                              display: flex;              
                                                              flex-direction: column;       
                                                              align-items: center;          
                                                              text-align: center;        
                                                              padding: 20px;       
}

.contact-content .contact-secondcontent .lower-contentsection .button-box{
                                                                          margin-top: 20px;
}

.contact-content .contact-secondcontent .lower-contentsection .button-box .disablebtncolor{
                                                                                           background-color: #009436;
                                                                                           padding: 10px 15px;
                                                                                           width: 150px;
                                                                                           color: #fff;
                                                                                           border: none;
                                                                                           font-size: 18px;
                                                                                           cursor: pointer;
}

/* ============================== css of secretariat page ========================== */


.sub_page > .contents > .heading_area2{
                                       position: relative;
                                       display: flex;
                                       height: 8rem;
}

.sub_page > .contents > .heading_area2 > h2{
                                            position: absolute;
                                            left: 5rem;
                                            font-size: 2rem;
                                            top: 1.4rem;
                                            z-index: 1;
}

.sub_page > .contents > .heading_area2 > h2::after{
                                                  content: '';
                                                  display: block;
                                                  width: 2rem;
                                                  margin: auto;
                                                  padding-top: 5px;
                                                  border-bottom: 1px solid #000;
}

.sub_page > .contents > .heading_area2 > p{
                                          position: absolute;
                                          right: 0;
                                          color: #D4FDED;
                                          font-size: 4.3rem;
                                          font-weight: bold;
}

/* ===================== css of achievement page ===================== */


.sub_page > .contents > .heading_area3{
                                       display: flex;
                                       position: relative;
                                       height: 8rem;
}

.sub_page > .contents > .heading_area3 > h2{
                                            position: absolute;
                                            left: 0rem;
                                            font-size: 2rem;
                                            top: 1.8rem;
                                            z-index: 1;
}

.sub_page > .contents > .heading_area3 > h2::after{
                                                   content: '';
                                                   display: block;
                                                   width: 8rem;
                                                   padding-top: 5px;
                                                   margin: auto;
                                                   border-bottom: 1px solid #000;
}

.sub_page > .contents > .heading_area3 > p{
                                           position: absolute;
                                           right: 0;
                                           color: #D4FDED;
                                           font-size: 4.3rem;
                                           font-weight: bold;
}

.sub_page > .contents > .heading_area4{
                                       display: flex;
                                       position: relative;
                                       height: 8rem;
}

.sub_page > .contents > .heading_area4 > h2{
                                            position: absolute;
                                            left: 0rem;
                                            font-size: 2rem;
                                            top: 1.8rem;
                                            z-index: 1;
}

.sub_page > .contents > .heading_area4 > h2::after{
                                                   content: '';
                                                   display: block;
                                                   width: 8rem;
                                                   padding-top: 5px;
                                                   margin: auto;
                                                   border-bottom: 1px solid #000;
}

.sub_page > .contents > .heading_area4 > p{
                                           position: absolute;
                                           right: 0;
                                           color: #D4FDED;
                                           font-size: 4.3rem;
                                           font-weight: bold;
}

/* =========== Design of stress check ============ */

.stress-button-design-cover{
                            background-color: #fff;
                            border: 5px solid #00AF56; 
                            padding: 30px 15px;
                            margin: auto;
                            margin-bottom: 60px;
                            width: 60%;
}

.stress-button-design{
                      text-align: center;
}

.stress-button-design .bigpara{
                               font-family: Arial, Helvetica, sans-serif;
                               font-size: 24px;
                               color: #FF9800;
}

.stress-button-design .smallpara{
                                 padding-top: 12px;
                                 padding-bottom: 12px;
}

.stress-button > a > button{
                            background-color: #00AF56;
                            border: none;
                            color: #fff;
                            padding: 20px 15px;
                            font-size: 28px;
                            border-radius: 50px;
                            cursor: pointer;
}

/* ============= Design of bcp page =============== */

.bcp-header{
            font-size: 25px;
            color: #000;
            padding-left: 30px;
}

hr.bcp-line{
            border: 0;
            height: 3px;
            background: #00AF56;
            margin-bottom:30px;
            margin-top: 5px;
            width: 4rem;
            margin-left: 190px;
}

.bcp-container-box{
                   padding-left: 30px;
                   padding-right: 30px;
                   display: flex;
                   margin-bottom: 50px;
}

.bcp-container-box1{
                    width: 70%;
}

.bcp-container-box1 p{
                      font-size: 18px;
                      padding-bottom: 10px;
}

.bcp-container-box1 a {
                       word-break: break-all;
                       overflow-wrap: break-word;
                       display: inline-block;
                       max-width: 100%;
}

.bcp-container-box2{
                    margin-left: 10px;
                    width: 30%;
}

.bcp-container-box2 .bcp-image-box img{
                                       width: 100%!important;
                                       height: auto;
}

.bcp-pdf-container{
                   border: 4px solid grey;
                   width: 80%;
                   margin: auto;
                   margin-bottom: 50px;
                   padding: 20px 25px;
}

.bcp-pdf-container .bcp-pdf{
                            display: block!important;
}

.bcp-pdf-container .bcp-pdf .first-row{
                                       margin-bottom: 10px;
}

.bcp-pdf-container .bcp-pdf .second-row{
                                        margin-bottom: 20px;
}

.bcp-pdf-container .bcp-pdf .third-row{
                                       margin-bottom: 40px;
}

.bcp-pdf-container .bcp-pdf .fourth-row{
                                        margin-bottom: 25px;
}

.bcp-pdf-container .bcp-pdf .fifth-row{
                                       margin-bottom: 30px;
}

.bcp-pdf-container .bcp-pdf .second-row,
.bcp-pdf-container .bcp-pdf .fourth-row{
                                        text-align: right;
}

.bcp-pdf-container .bcp-pdf .fifth-row{
                                       text-align: center;
}