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

/* タブレット用 */
@media screen and (max-width: 1280px) and (min-width: 767px) {

	html, body {
		min-width: 0;
		width: 100%;
		height: 100%;
		-webkit-text-size-adjust : 100%;
	}

    a[href^="tel:"] {
		pointer-events: auto;
	}
	
	input[type="submit"] {
	  appearance: none;
	  -webkit-appearance: none;
	}
	
	.cd-fixed-bg {
        background-attachment: scroll;
		background-size: cover;
	}
    
	img {
		max-width: 100% !important;
		height: auto;
	}
    
    .tablet_none {
        display: none;
    }
    
    .inner {
        width: 90%;
    }

    header h1 {
        width: 30%;
        margin-right: 1rem;
    }
    
    header nav ul li {margin-right: 2rem;}
    header nav ul li .entry {
        width: 12rem;
        height: 4rem;
        line-height: 4rem;
        border-radius: 2rem;
    }
    
    header nav ul li a {
        font-size: max(1.4rem,12px);
    }
    
	/*-----------------------------

	top

	------------------------------*/
    .top-message {
		width: 95%;
		max-width: 95%;
	}

    .top-message p {
		font-size: max(2rem,16px);
		}
    
    .top-news .news-ttl .character01 {
		padding-left: 0;
		text-align: center;
		width: 50%;
	}

	.top-news .news-info {
		width: 892px;
		max-width: 70%;
		padding: 4rem 6rem;
	}
    
    .top-news .news-info::before {
		width: 40px;
		height: 32px;
		left: -40px;
	}

    .top-news .news-info ul li p {
		font-size: max(1.8rem,14px);
	}

    .top-news .news-info ul li h3 {
		font-size: max(1.8rem,14px);
	}

    .top-about .character02 {
		width: 10%;
		margin-left: auto;
		text-align: right;
		padding-right: 0;
		margin-top: -4rem;
	}
    
    .top-about ul li .about-inner .about-info .arrow {
		width: 10%;
		position: absolute;
		bottom: -4rem;
		right: 4rem;
	}
	
    .top-about ul li .about-inner .about-info p {
		font-size: max(1.8rem,14px);
	}
    
   .box {height: 400px;}
	/* .cd-fixed-bg {
		background-position: top -23px center;
	}*/

    .top-works .works-info p {
        margin-right: 2rem;
		font-size: max(1.8rem,14px);
	} 
    
    .character03 img{
		width: 50%;
	}	
    
    .btn01 {width: 100%;}
    
    .top-support .support-info,
    .top-support .support-img {
        width: 47%;
    }

    .top-support .support-img {
        display: flex;
        align-items: center;
    }
    
    .top-support .support-info p {
        font-size: max(1.8rem,14px);
    } 

    .support-btn {
        margin:  0 auto;  
        padding-left: 0rem;
    }
    
    .support-btn .btn01 a {
        font-size: max(1.8rem,14px);
    }
    
   .top-support .character04 {
        width: 80%;
        padding-left: 0rem;
    }
    
    .top-support .character04 img {
        width: 15%;
    }
    
    .top-person h2 {
        margin-right: 4rem;
    }
    
    .top-person p.person-txt {
        margin-bottom: 3rem;
       font-size: max(1.8rem,14px);
    }
    
    .top-person .cat {
        font-size: max(1.4rem,14px);
    }
    
    .top-person h3 {
        font-size: max(2rem,18px);
    }
        
    .top-person h3.fnts-20{
       font-size: max(2rem,18px);
    }

    .top-person .swiper02 p {
       font-size: max(1.4rem,14px);
    }
    
    .top-person .swiper02 {
		padding-right: 7.5rem;
        padding-left: 7rem;
	}
    
    .swiper02 .swiper-button-next{
		margin-left: 2rem;
	}
    
    .mount-container .character05 {
        right:  10%;
        width: 50%;
    }
    
    .mount-container .character05 img {
        width: 35%;
    }
    
    .entry-inner p {
        font-size: max(1.8rem,14px);
    }
    
    .entry-inner .entry-info,
    .entry-inner .entry-btn {
        width: 47%;
    }
    
    .entry-inner .entry-btn .btn {
        width: 100%;
    }

    .internship-info p {
        margin-bottom: 4rem;
        font-size: max(1.8rem,14px);
    }
    
    .internship-info .arrow {
		width: 14%;
        margin: -2rem 0 3rem auto;
	}
	
    
    
    
	/*-----------------------------

	page

	------------------------------*/
    #pan,
    #pan a{
		font-size: max(1.6rem,14px);
   }
    
    #page-main h2 {
		font-size: max(2rem,14px);
   }

   #page-main p {
		font-size: max(1.8rem,14px);
   }
    
    
    /*-----------------------------

	business

	------------------------------*/
   .business-message .message-img p {
		font-size: max(2rem,14px);
   }
    
    .business-message .message-img p span {
		font-size: max(1.6rem,14px);
   }
    
    .business-message .message-txt {
        width:100%;
    }
    
    .business-message .message-txt p {
		font-size: max(1.8rem,14px);
   }
    
    .business-message .message-txt p .pc_only {
		display: none;
   }
    
    .business-vision .vision-info h3 span::before {
		left: -40px;
		top: 0px;
    } 
        
    .business-vision .vision-info h3 span::after {
		bottom: 16px;
		right: -40px;
    }

    .business-vision .vision-info p {
		font-size: max(2rem, 16px);
    }
    
    .business-area .business-info .pc_only {
        display: none;
    }
    
    .business-area .business-info p {
		font-size: max(1.6rem, 14px);
    }
    
    .business-history .history-area ol li .circle {
		font-size: max(1.8rem, 16px);
		padding-bottom: 6rem;
    }
    
    .business-history .history-area ol li:first-child .circle:before {
		top: -9px;
    }

    .business-history .history-area ol li dl dt {
		font-size: max(2rem, 16px);
    }

    .business-history .history-area ol li dl dd {
		font-size: max(1.6rem, 14px);
    }
    
    .business-overview .overview-info ul li dl dt {
		font-size: max(1.8rem, 14px);
    }
    
    .business-overview .overview-info ul li dl dd {
		font-size: max(1.8rem, 14px);
    }
    
    
    /*-----------------------------

    data

    ------------------------------*/
    .box3 .data_item_inner img{
		width: 40%;
    }
    
    .box2 .data_item_inner img{
		width: 25%;
    }
    
    .box3 .data_item_inner img.width72 {
        width: 50%;
    }
    
    .box1 .data_item_inner img.width72 {
        width: 15%;
    }
    
    .data_item img.width56 {
        width: 35%;
    }
    
    h3.data_title {
		font-size: max(2rem, 16px);
    }
    
    .data_title_inner .unit {
    	font-size: max(2.4rem, 18px);
    }
    
    .data_caption {
    	font-size: max(1.4rem, 14px);
}
    
    
    /*-----------------------------

    jpb-type

    ------------------------------*/
    .job-type-list .job-type-title h4 {
    	font-size: max( 2.4rem, 18px);
    }
    
    .job-type-list .job-type-title .cat {
    	border-radius: 4rem;
    	font-size: max(1.4rem, 12px);
    	line-height: 30px;
    }
    
    .job-type-list .job-type-card-info p {
    	font-size: max(1.6rem, 14px);
    }
    
    
    /*-----------------------------

    career-support

    ------------------------------*/
    .career-support-ttl p {
    	font-size: max(1.8rem, 14px);
    }

    .career-support-area .support_title h3,
    .career-support-area ol li dl dt,
    .career-support-area ol li dl .training-list h4 ,
    .career-support-area .support_list .support-list li h3 {
    	font-size: max(2.4rem, 18px);
    }
    
    .career-support-area ol li dl .training-list p,
    .career-support-area .support_list ul li .support-info p {
    	font-size: max( 1.6rem, 14px);
    }
    
    .career-support-area ol li .circle {
    	font-size: max( 1.8rem, 18px);
    }

    
    /*-----------------------------

    welfare-benefits

    ------------------------------*/
    .welfare-benefits .welfare-benefits-item ul {
    	row-gap: 3rem;
    }
    
    .welfare-benefits .welfare-benefits-item ul li {
    	 width: 48.5%;
    }
    
    .welfare-benefits .welfare-benefits-item ul li h4 {
    	font-size: max( 2.4rem, 18px);
    }
    
    .welfare-benefits .welfare-benefits-item ul li p {
    	font-size: max( 1.6rem, 14px);
    }
    
    .welfare-benefits-item .club-title-inner h3 {
    	width: 20%;
    }
    
    .welfare-benefits-item .club-title-inner p {
    	font-size: max( 1.6rem, 14px);
    }
    
    
    /*-----------------------------

    interview

    -----------------------------*/
    .interview .interview-movie-inner .interview-movie {
        width: 70%;
        height: auto;
    }
    
    .interview .interview-movie-inner h3 {
        font-size: max( 1.8rem, 14px);
    }

    .interview .interview-movie-inner span {
        font-size: max( 3.2rem, 20px);
    }
    
    
    /*-----------------------------

    recruitment

    ------------------------------*/
    .recruitment-ideal h2.page_ttl {
        font-size: max( 2rem, 18px);
    }
    
    .recruitment-ideal .recruitment-ideal-info p {
       font-size: max( 1.6rem, 14px);
    }
    
    .recruitment-description ul .description-job-list-item {
       border-radius: 60px;
    }
    
    .recruitment-description .description-job-list h3{
       font-size: max( 2.4rem, 20px);
    }
    
    .recruitment-description ul li dt {
       font-size: max( 1.8rem, 14px);
    }
    
    .recruitment-description ul li dd,
    .recruitment-description ul li dd ul li {
       font-size: max( 1.6rem, 14px);
    }
    
    .recruitment-selection .selection-list h3,
    .recruitment-selection ul li ul li h4{
       font-size: max( 2.4rem, 20px);
    }
    
    .recruitment-selection ul li ul li p,
    .selection-process-list-item ul li{
       font-size: max( 1.6rem, 14px);
    }
    
    .selection-process-list-item ul li {
       width: 23%;
       height: 28rem; 
    }

    .entry-btn .btn a {
        font-size: max( 2rem, 18px);
    }
    
    
    /*-----------------------------

    internship

    ------------------------------*/
    .internship-inner p {
        font-size: max( 1.6rem, 14px);
    }
    
    .internship-left {
        width: 35%;
    }
    
    .internship-right {
        width: 60%;
    }
    
    .internship-right dl dt {
        font-size: max( 1.8rem, 14px);
    }
    
    
    
      
    /*-----------------------------

    footer

    ------------------------------*/
    footer .f_nav h3 {
        font-size: max(1.6rem,12px);
    }

    footer .f_nav h3 span {
        font-size: max(2.4rem,14px);
    }

    footer .f_nav ul li a {
        font-size: max(1.6rem,12px);
    }

    ooter p.copyright {
        font-size: max(1.2rem,10px);
    }
    
    .sns-logo a {
        font-size: max(1.6rem,12px);
    }
    
    
    
    .btn {
        max-width: 400px;
    }
    
    .btn a {
        font-size: max(2rem,14px);
        max-height: 80px;
    }
    
    .btn01 {
        max-width: 298px;
    }
    
    .btn01 a{
        font-size: max(1.8rem,14px);
        max-height: 66px;
    }
    
    .footer_btn a {
        font-size: max(1.6rem,12px);
    }
    
    .sns-logo-inner .sns-circle img {
        width: 60%;
    }
        
}