@charset "UTF-8";html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,pre,form,p,blockquote,fieldset,input,abbr,article,aside,command,details,figcaption,figure,footer,header,hgroup,mark,meter,nav,output,progress,section,summary,time{margin:0;padding:0;}
body{font-family:-apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", sans-serif;background-color:transparent;color:#333;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%;}
h1,h2,h3,h4,h5,h6,pre,code,address,caption,cite,code,em,strong,th,figcaption{font-size:1em;font-weight:normal;font-style:normal;}
fieldset,iframe{border:none;}
table{border-collapse:collapse;border-spacing:0;}
article,aside,footer,header,hgroup,nav,section,figure,figcaption{display:block;}
ul li{list-style:none;}
a img{border:none;}
.nav_icon li a img{border-radius: 16px;box-shadow: 0 4px 3px -2px rgba(0, 0, 0, 0.8);}
.wrapper_box p img{border-radius: 16px;box-shadow: 0 4px 3px -2px rgba(0, 0, 0, 0.8);}
.main p img{border-radius: 16px;box-shadow: 0 4px 3px -2px rgba(0, 0, 0, 0.8);}
@-webkit-keyframes month_mov{0%{-webkit-transform:translate(-100px, 0px);opacity:0;}
100%{-webkit-transform:translate(0px, 0px);opacity:1;}
}
@-webkit-keyframes rotate_mov{0%{-webkit-transform:rotateZ(0deg);}
100%{-webkit-transform:rotateZ(360deg);}
}
@-webkit-keyframes switch_mov{0%{-webkit-transform:rotateY(0deg);}
100%{-webkit-transform:rotateY(360deg);}
}
@-webkit-keyframes tiny_apple{0%{opacity:1;}
8%{opacity:1;}
10%{opacity:0;}
90%{opacity:0;}
92%{opacity:1;}
100%{opacity:1;}
}
@media only screen and (max-width:320px){body{width:320px;}
}
@media only screen and (min-device-width:768px) and (max-device-width:1024px){body{width:768px;margin-left:auto;margin-right:auto;}
}
header{padding-right:5px;padding-left:5px;height:390px;}
/*footer{background:#fff;}*/
.hear_wrap{background:#71bbd2;min-width: 256px;max-width: 700px;margin-left: auto;margin-right: auto;border-radius: 25px;}
#maincal_input{display:none;}
.wrapper_box{position:relative;min-width:256px;max-width:600px;margin-left:auto;margin-right:auto;top:0.5em;clear:both;-webkit-transition:all .15s ease-out;-moz-transition:all .15s ease-out;transition:all .15s ease-out;padding-right:0.5em;padding-left:0.5em;padding-bottom:1em;}
h1{margin-bottom: .5em;word-spacing: 0.24em;font-size: 18px;color: #333;text-shadow: 0px 1px 0px #fff;font-weight: bold;letter-spacing: 0.05rem;}
h2{margin-top:2em;font-weight: 700;}
h3{margin-bottom:0.5em;text-align:center;color:#414141;padding-top:.5em;padding-bottom:.5em;}
a{color:#fff;text-align:center;}
p .textlink{text-align:center;}
p .helplink{display:block;width:200px;margin-right:auto;margin-left:auto;}
#main_pic{float:left;margin-right:1em;}
.tiny_apple{display:block;position:absolute;top:11px;left:22px;z-index:1;width:13px;height:20px;background:url(../img/apple_black.gif) 0 0 no-repeat;background-size:13px 20px;-webkit-animation-name:tiny_apple;-webkit-animation-duration:15s;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;}
.sat{clear:left;line-height: 1.55;}
.month_mov{width:60px;height:60px;position:relative;-webkit-animation-name:month_mov;-webkit-animation-duration:2s;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:1;}
.nav_box{min-width:256px;max-width:700px;margin-left:auto;margin-right:auto;}
.nav_icon{display:-webkit-flex;-webkit-flex-direction:row;-webkit-flex-wrap:nowrap;-webkit-justify-content:space-around;height:95px;}
ul{display:-webkit-flex;-webkit-flex-direction:row;-webkit-flex-wrap:nowrap;-webkit-justify-content:space-around;width:100%;margin-top:0.5em;}
.nav_icon ul li{-webkit-flex:0 0 58px;-webkit-align-items:center;-webkit-justify-content:space-around;height:56px;position:relative;}
.nav_icon ul li a{display:block;text-decoration:none;width:56px;height:56px;}
.nav_icon ul li span{text-decoration:none;display:block;border-style:none;font-size:xx-small;text-align:center;line-height:1em;color:#333;}
/*.nav_icon li a .mask56{display:block;position:absolute;top:0;left:0;z-index:1;width:56px;height:56px;background:url(../img/mask175.png) 0 0 no-repeat;background-size:56px 56px}*/
/*.mask60{display:block;position:absolute;top:0;left:0;z-index:1;width:60px;height:60px;background:url(../img/mask175.png) 0 0 no-repeat;background-size:60px 60px}*/
.rotate{-webkit-animation-name:rotate_mov;-webkit-animation-duration:2s;-webkit-animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;}
.sns{overflow:hidden;background:#ff5a45;margin:0px auto;}
.sns nav ul{display:-webkit-flex;-webkit-flex-direction:row;-webkit-flex-wrap:wrap;-webkit-justify-content:space-around;min-width:256px;max-width:700px;margin-left:auto;margin-right:auto;align-items: center;height: 50px;}
.sns nav .sns_box{margin-top:0;}
.sns nav ul li{-webkit-flex:0 0 0px;-webkit-align-items:center;-webkit-justify-content:space-around;-webkit-transition:1s ease;}
.sns nav ul li span{display:inline-block;}
.sns nav .sns_box li .sns_twi_follow{text-indent:0px;}
small{width:100%;background:#414141;clear:both;display:block;}
small p{width:310px;margin-left:auto;margin-right:auto;padding-right:5px;padding-left:5px;background:none;clear:both;text-align:center;color:#fff;}
form#cse-search-box{margin-bottom:2em;text-align:center;}
form#cse-search-box input[type="submit"]{-webkit-appearance:none;background:#e0e0e0;border:1px solid #999;width:3em;line-height:2em;border-radius:5px;color:#666;}
form#cse-search-box input[type="text"]{-webkit-appearance:none;border:1px solid #999;border-radius:5px;line-height:2em;}
ins{text-align: center;text-decoration:none;}
.center_ad{height:50px;}
.center_ad article{height:50px;width:320px;}
.ad{height:250px;}
.ad article{height:250px;width:300px;margin-right:auto;margin-left:auto;}
.adbox_respnsiv{text-align:center;overflow:hidden;}
.adbox_respnsiv_w{text-align:center;background:#fff;}
.ad_l{background:#548c9d;height:100px;margin-top:0;text-align:center;}
.ad_l article{height:100px;width:320px;margin-right:auto;margin-left:auto;background:#7fbece;}
.g_link{overflow:hidden;background:#18556a;margin:0.5em auto 0;}
.g_link h3{color:#FFF;background:#24809f;}
#out_link{display:-webkit-flex;-webkit-flex-direction:row;-webkit-flex-wrap:wrap;-webkit-justify-content:space-around;min-width:256px;max-width:700px;margin-left:auto;margin-right:auto;margin-bottom:0.5em;}
#out_link li{list-style:none;-webkit-flex:1 0 38px;-webkit-align-items:center;-webkit-justify-content:space-around;height:38px;padding-top:.5em;padding-bottom:.5em;-webkit-transition:1s ease;}
#out_link li a{display:block;}
.small-cap{font-variant-caps: all-small-caps;}
/*navi style*/
.nav_wall {min-width:256px;max-width:700px;margin-left:auto;margin-right:auto;}
.nav_wall a {display:inline-block;}
.nav_wall h3{height:102px; margin-bottom:0;display: flex;
  justify-content: center;
  align-items: center;}
.nav_wall h3 a{font-size:1em; line-height:20px; color:#333; text-decoration:none;margin-left: 80px;}
#w_ai{background: linear-gradient(116.93deg,#3f4954 1%,#26292d 80%);border-radius: 30px;box-shadow: 0 6px 4px -2px rgba(0,0,0,0.24);color: #7FCFF4;padding: 3rem;-webkit-border-radius: 30px;font-weight: bold;font-size: 21px;}
#w_wall{background:url(https://cal.hokkyokudesign.com/wallpaper/01main/menu/ipx.png) no-repeat;background-size:52px 102px;background-position: 10% 50%;background-color:#F2F0E5;}
#w_blog{background:url(https://cal.hokkyokudesign.com/wallpaper/01main/menu/blog.png) no-repeat;background-size:52px 102px;background-position: 10% 50%;background-color:#64CADF;}
#w_eme{background:url(https://cal.hokkyokudesign.com/wallpaper/01main/menu/eme.png) no-repeat;background-size:52px 102px;background-position: 10% 50%;background-color:#c34516;}
/*darkmode*/
@media (prefers-color-scheme: dark) {
  body{background-color:#000;color:#fff;}
  .nav_icon{background-color:#000;color:#fff;}
  /*.nav_icon ul li span{background:#111;color:#fff;}*/
  .hear_wrap{background-color:#102b34;}
  .nav_wall h3 a{color:#fff;}
  h1{color:#fff;text-shadow: 0px 1px 0px #333;}
  h3{color:#fff;}
  #w_wall{background:url(https://cal.hokkyokudesign.com/wallpaper/01main/menu/ipx.png) no-repeat;background-size:52px 102px;background-position: 10% 50%;background-color:#272414;border-radius: 25px 25px 0 0;}
  #w_blog{background:url(https://cal.hokkyokudesign.com/wallpaper/01main/menu/blog.png) no-repeat;background-size:52px 102px;background-position: 10% 50%;background-color:#0c3138;}
  #w_eme{background:url(https://cal.hokkyokudesign.com/wallpaper/01main/menu/eme.png) no-repeat;background-size:52px 98px;background-position: 10% 50%;background-color:#361306;border-radius: 0 0 25px 25px;}
  .sns{background-color:#450800;}
  .nav_box .nav_icon ul li a span{color:#fff;}
  .parara_iphone2 {background:#000;}
  .parara_iphone3 {background:#000;}
   .nav_wall #w_fl a{color:#333;}
    .nav_wall #w_cal a{color:#333;}
    .nav_wall #w_ultra a{color:#333;}
}