@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url('https://fonts.googleapis.com/css2?family=Kaisei+HarunoUmi:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@700&display=swap');


* {
    font-family: 'Noto Sans Japanese',   sans-serif;
}

body{
	margin:0;
	padding:0;
	background-size: 30px 30px;
	background-attachment: fixed;
	background-size: auto auto;
	background-color: rgba(224, 224, 224, 1);
	/* background-image: repeating-linear-gradient(45deg, transparent, transparent 2px, rgba(201, 215, 199, 1) 2px, rgba(201, 215, 199, 1) 6px ); */
	/* background-image: linear-gradient(to bottom, #8ec7d8 0%, #dcf1f3 100%); */
	/*background-image: linear-gradient(to bottom, #43636d 0%, #6bac98 100%);*/
	background-image: linear-gradient(to bottom, skyblue 0%, cornsilk 60%, mistyrose 100%);
	/* background-image: url(../img/topimg_01_20210825.jpg); */
	width: 100%;
	height: 100%;
	min-height: 100vh;
}

/* 強制的改行 */
/* （<span>で改行後１文字目を囲む） */
.br::before {
	content: "\A" ;
	white-space: pre ;
}
/* 部分的に中央揃え */
.cntr{
	display: flex;
	justify-content: center;
	align-items:center;
}


/* ヘッダーエリア */
/* ロゴとタイトル */
/* ロゴとタイトル */
.top{
	display:flex;
	height: 80px;
	width: 100%;
	background-color: ghostwhite;
	border-bottom: solid 6px  rgb(0, 156, 88);
	align-items:center;
	padding-left: 20px;
  }

  .top #logo{
	width: 300px;
	height:50px;
	display: flex;
  }

  .top #logo img{
	width: 300px;
	height:50px;
  }

  .top #title{
	width: 100%;
	height: 80px;
	display: flex;
	/* vertical-align:top; */
	align-items:center;
	padding-left: 20px;
  }

  .top #title h1{
	font-family: 'M PLUS Rounded 1c', sans-serif;
	color:rgb(0, 156, 88);
	width: auto;
	height:auto;
	font-weight: 400;
	font-size: 25px;
}


/* ログインページ */
.main {
    background-color:rgb(255, 255, 255,0.5);
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left:20px;
    margin-right:20px;

    padding-top: 20px;
    padding-bottom: 20px;
    padding-left:20px;
    padding-right:20px;
    border-radius: 10px;
}

.main h1,.main h2{
    margin:30px;
    margin-bottom:0;
    padding:20px;
    padding-bottom:0;
	color:dimgray;
	font-weight: 400;
	font-size: 40px;
}

.main h3{
    margin:30px;
    margin-bottom:0;
    padding:20px;
    padding-bottom:0;
	color:orange;
	font-weight: 400;
	font-size: 25px;

}

.myna{
    margin:20px;
    padding:20px;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 20px 20px 20px 20px;
    border: 1px;
    /*column-count: 2;*/
   float: left;
}
#myna{
    /*
    column-count: 1;
    column-width: 200px;*/
    float: left;
    width: 200px;
}

p{
    margin:30px;
    margin-bottom:0;
    padding:20px;
    padding-top:0;
    padding-bottom:0;
    display: flex;
}

/* 注意書き（赤） */
.section_p90{
	text-indent:0em;
	padding: 0.2em 0.2em 0.2em 1.5em;
	color:red;
	}
	.section_p90::before{
		content: "※ " ;
}

/* フォームエリア */
form{
    margin:20px;
    padding:20px;
    background-color: rgba(255, 255, 255, 0.7);
    border-radius: 20px 20px 20px 20px;
    border: 1px;
    text-align: center;
}

input{
    margin:10px;
    height:40px;
}

input[type='text'],input[type='password'] {
	font: 15px/24px sans-serif;
	box-sizing: border-box;
	width: 50%;
	padding: 0.3em;
	transition: 0.3s;
	letter-spacing: 1px;
	color: #aaaaaa;
	border: none;
	border-bottom: 2px solid #1b2538;
	background: transparent;
}

input[type='submit'] {
	width: 50%;
	border-bottom: 2px solid #da3c41;
	color:white;
	background-color: crimson;
	border-radius: 15px 15px 15px 15px;
}

input[type='text']:focus{
	border-bottom: 2px solid #da3c41;
	outline: none;
}

input[type='password']:focus{
	border-bottom: 2px solid #da3c41;
	outline: none;
}

.ren01 input[type='password']:focus{
	border-bottom: 2px solid #da3c41;
	outline: none;
}

input[type='submit']:focus {
    width: 50%;
    border-bottom: 2px solid #da3c41;
    font:rgb(177, 226, 43);
    background-color: rgb(245, 192, 212);
}

/* コピーライト */
.copyright{
	padding:10px;
	font-size:0.8em;
	font-family: 'Noto Sans Japanese',   sans-serif;
	color:darkgray;
    justify-content: center;
}

/* PDFアイコンリンク */
a[href*=".pdf"]:after {
	content:" ";
	display: inline-block;
	width: 32px;
	height: 32px;
	background: url(img/icon_pdf.png) no-repeat;
}




	/* スマホ */
	@media screen and (max-width: 798px) {

            html {
                overflow-x: hidden;
            }
    
            .top{
                display: block;
                height: 80px;
                width: 100%;
                padding-top: 0px;
                padding-left: 0px;
              }

            .top #logo {
                margin-left:0;
                display: block;
                width: 200px;
                height: auto;
                /* border: 2px solid#c02e88; */
            }

            .top #logo img{
                width: 200px;
                height: auto;
            }
    
            .top #title{
                display: block;
                padding:0px;
                height:20px;
                /* border: 2px solid #1b2538; */
            }
    
            .top #title h1{
                font-size: 0.8em;
                padding:0;
                padding-left:10px;
                margin:0;
                height: auto;
                
            }

            /* ログインページ */
            .main {
                margin-top: 10px;
                margin-bottom: 10px;
                margin-left:10px;
                margin-right:10px;

                padding-top: 10px;
                padding-bottom: 10px;
                padding-left:0px;
                padding-right:0px;
                border-radius: 10px;
            }

            .main h1,.main h2{
                margin:10px;
                margin-bottom:0;
                padding:10px;
                padding-bottom:0;
                color:dimgray;
                font-weight: 300;
                font-size: 30px;
            }

              .main h3{
                margin:10px;
                margin-bottom:0;
                padding:10px;
                padding-bottom:0;
}

            p{
                margin:10px;
                margin-bottom:0;
                padding:10px;
                padding-top:0;
                padding-bottom:0;
                display: flex;
            }

            .myna{
                margin:20px;
                padding:10px;
                background-color: rgba(255, 255, 255, 1.0);
                border-radius: 10px 10px 10px 10px;
                border: 1px;
                /*column-count: 2;*/
                float: none;
            }

            #myna{
                float: none;
                display: block;
                margin:auto;
            }

    }