@charset "utf-8";

img{width:100%;}

a{color:black;
  text-decoration: none;}

a:hover{color:grey;}


.contents{width:100%;
          max-width: 500px;
          margin:0 auto;}

.logo{width:70%;
      margin:25px auto 20px auto;
      text-align: center;}

h1{font-size:17px;}

.wrapper{width:100%;
         max-width: 500px;
         margin:0 auto;}

h2{ 
    width:100%;
    background-color: orange;
    padding:10px;
    font-size: 16px;
    color:white;
    text-align: center;
    font-weight: bold;}

h2 span.sub{font-size: 12px;}

h3{font-size:16px;}

h3 span{margin-right: 15px;}

.topimg{width:90%;
        max-width: 500px;
        margin:0 auto;}

/* 二重線ボックスここから */
.border_box{/* 二重線 */
  margin: 2em auto; /* 外側余白 */
  padding: 1em 2em; /* 内側余白 */
  border:5px double #CCCFD6; /* 線の種類・太さ・色 */
  max-width: 800px; /* 最大幅 */
}

/* ボックス内の段落（余白なし） */
.border_box p { margin: 0;}

/* 二重線ボックスここまで */

.point{text-align: center;}

/* ふせん風 */
.cstm-box-sticky {
  margin: 2em auto; /* 外側余白 */
  padding: 1.5em; /* 内側余白 */
  border-left: solid 4px #9dace1; /* 左側の線 */
  background-color: #f5f7ff; /* 背景色 */
  max-width: 800px; /* 最大幅 */
}

/* ボックス内の段落 */
.cstm-box-sticky p {
  margin: 0;
}


span.certificate{font-weight: bold;
                color:red;}

.work{width:98%;
      margin:0 auto;
      background-color: orange;
      padding:0.003% 1%;
      text-align: center;}

.adressbox{text-align: center;
           color:orange;
           font-weight: bold;
           margin-bottom: 20px;}

/* 手書き風 */
.cstm-box-handdrawn {
   background-color: #f0e68c;
   margin: 2em auto; /* 外側余白 */
   padding: 2em;   /* 内側余白 */
   border-radius: 30px 60px / 60px 30px;  /* 角をランダムに丸めて手書き風に */
   border: solid 5px orange;   /* 太めの枠線（8px、色: #ccc7be） */
    max-width: 800px; /* 最大幅 */
}

/* ボックス内の段落 */
.cstm-box-handdrawn p { margin:0; }

footer{text-align: center;}