@charset "UTF-8";

body{
    background-image: url(../img/bg_ptn.png);
    background-repeat: repeat;
    text-align: center;
    margin: auto;
}

img {
	max-width:100%;
	height: auto;/*高さ自動*/
    margin: 0;
    padding: 0;
    vertical-align: bottom;
}


p,div,section,{
    margin: 0 auto;
    padding: 0;
}


h1,h2,h3,.container{
    max-width: 750px;
    margin: 0 auto;
    padding: 0;
    display: block;
}

/*ヘッダー
-------------------------------------*/
header{
    max-width: 750px;
	display: flex;
    flex-direction: row;
    margin: 0 auto;
    text-align: left;
}

header h1{
        font-size: 1rem;
        margin-left: 1%;

}

header h1 img{
    margin: 1% 3% 1% 0;
    max-width: 50%;
    height: auto;
vertical-align: middle}

header h1 span{
  vertical-align: text-bottom;
}


/*メイン画像
-------------------------------------*/
#mainimg {
    width: 100%;
    margin: 0 auto;
    position: relative;
    height: auto;
}

}
#mainimg img {
        width:100%;
        max-width: 750px;
        display: block;
        margin: 0 auto;
    }
#main_in {
    position: absolute;
    max-width: 750px;
    height: auto;
    width: 100%;
    bottom: 4%;
    left: 0%;
    text-align: left;
}

#main_in img{
        display: block;
        height: auto;
}

#main_in img.apple,#main_in img.google{
        margin-left: 5%;
        margin-bottom: 2%;}

/*2022年3月追加部分
-------------------------------------*/
#bnr_clw{
    margin-bottom: 100px;
}

#merit{
    margin-bottom: 25px;
}

/*キャッチコピー
-------------------------------------*/
.catch {
    margin:30px auto 0;
}
.catch h2 {
}

.center {
	text-align: center;
}

/*point
-------------------------------------*/
#main{
    margin-bottom: 3rem;
    width: 100%;
}

#points {
    width: 100%;
    margin: 0 auto;
}


#points .point {
    position: relatve;
    width: 100%;
    max-width: 750px;
    height: auto;}

#points .point img {
        width:100%;
        max-width: 750px;
        display: block;
        margin: 0 auto;
    }


/*募集職種など
-------------------------------------*/
.title img{
    margin: 0 auto 2.5%;
    height: auto;
    max-width: 750px;
    width: 100%;

}

.line
{   width: 100%;
    height: auto;
    max-width: 668px;
    margin: 2.5% auto 3%;
    padding: 0 1%;
}

.textlist{
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
}


@media screen and (min-width:601px) { 

.textlist ul{
    list-style-type: none;
    column-count: 3;
    text-align: left;
}}



@media screen and (max-width:600px) { 
    /*　画面サイズが600pxからはここを読み込む　*/

.textlist{
    font-size: 0.9rem;
}
.textlist ul{
    list-style-type: none;
    column-count: 2;
    text-align: left;
}
}


.company{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 95%;}

.company ul{
    list-style-type: none;
    column-count: 3;
    margin: 0 0 20px;
}

.company li{
    margin-bottom: 10%;
}


/*フッター
-------------------------------------*/
footer {
    width: 100%;
    margin: 0 auto;
    border-bottom: 15px solid red;    
}

#footer {
    width:100%;
    max-width: 750px;
    position: relative;
}
#footer img {
        max-width: 100%;
        height: auto;
        display: block;
        margin: 0 auto;
    }
#footer_in {
    position: absolute;
    max-width: 750px;
    top: 55%;
    left: 70%;
    text-align: left;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);}


#footer_in img {
        width: 100%;
        height: auto;
        margin: 7% auto;
    }




/*コピーライト
-------------------------------------*/
.copyright {
    text-align: center;
    margin:1rem auto 3rem;
    font-weight: 800;
}
.copyright a {
    color: #000;
    display: block;
    text-decoration: none;
    margin-bottom:0.5rem;
    font-size: 1.2rem;
}

.copyright a:hover{
    color: darkred;
}


/*ページトップへ戻るボタン
-------------------------------------*/
#pagetop {
    position: fixed;
    bottom: 15px;
    right: 15px;
}
#pagetop a {
    display: block;
    background: #000;
    color: #fff;
    width: 50px;
    padding: 10px 5px;
    text-align: center;
}
#pagetop a:hover {
    background: #666;
}