*,
*:before,
*:after{box-sizing: border-box;}

html{scroll-behavior: smooth; scroll-padding-top:0; font-size:clamp(14.5px,1.45vw,18px);}

body {background: none #204377; color: #000; font-weight: 450; font-family:"Yu Gothic", "游ゴシック", YuGothic, "游ゴシック体","ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif; line-height:1.8; min-width:1000px; position:relative; overflow-wrap: break-word; -webkit-text-size-adjust: none;}

.supporttitle {color: #fff; font-size: 160%; margin: 1em auto; padding: 0 1em; text-align: center;}

.wrapper { width: calc(100% - 40px); max-width: 1200px; background: #ffffff; padding:2em 4em; margin: 2em auto; border-radius: 1em; }

p{margin: 1em 0;}

.center{text-align: center;}

a { color: #1A75BA; text-decoration: underline;}
a:hover { text-decoration: none;}

img{max-width:100%; height: auto; position:relative; line-height:1; vertical-align:middle;}

/* ダウンロードボタン */
.download_wrap { text-align: center; margin: 2em auto; }
.d-button { display:inline-block; border:none; padding: 0.7em 3em; color:#fff; font-weight:bold; vertical-align:middle; font-size:160%; line-height:1.2; cursor: pointer; background:linear-gradient(to bottom,#86a3c1,#04427b); border-radius: 0.5em; position:relative; text-decoration:none; }
.d-button:hover{ opacity:0.7; }

/* リモートボタン */
.rmt_button { display:inline-flex; align-items: center; justify-content: center; gap:0.5em; background-color: #0d91ce; border:none; color: white; border-radius: 0.5em; padding: 0.3em 2em; font-weight: bold; text-decoration: none; line-height: 1.2;}
.rmt_button img{width: 2.4em; height: 2.4em; object-fit: contain;}
.rmt_button:hover { opacity: 0.7; }

.tejun_title { font-size: 180%; color: #204377; margin: 0 0 1em; position: relative; line-height: 1.6;}
.tejun_title:has(.icon){padding-left: 2em;}
.tejun_title .icon{width: 1.6em; height: 1.6em; object-fit: contain; position: absolute; top: 0; left: 0;}

.tejun_heading { font-size: 140%; margin: 0 0 0.5em; text-align: center;}

hr{background-color: #204377; margin: 1.5em auto;}

ul.tejun_nav { display: flex; justify-content: center;  text-align: center; line-height: 1.4; margin: 2em auto;}
ul.tejun_nav>li { width: calc(100% / 3); font-size: 110%;}
ul.tejun_nav a { font-weight: bold; display: block;}
ul.tejun_nav img { width: 60px; height: 60px; object-fit: contain; margin-bottom: 0.3em;}
ul.tejun_nav small { font-weight: 500; font-size: 70%;}

section+section{margin-top: 6em;}

p:has(.num){position: relative;}
p>.num:first-child{background: #f7511f; color: #fff; font-weight: bold; position: absolute; top: 0; left: -2.2em; width: 1.8em; height: 1.8em; display: inline-flex; align-items: center; justify-content: center; border-radius: 99em;}

/* 文字色 */
.color{color: #1A75BA;}
.color.orange{color: #f7511f;}
.color.red{color: #ff0000;}

/* トップに戻るボタン */
html { scroll-behavior: smooth; }
.pagetop { height: 50px; width: 50px; position: fixed; right: 30px; bottom: 30px; background: #fff; border: solid 2px #204377; border-radius: 50%; display: flex; justify-content: center; align-items: center; z-index: 2; }
.pagetop__arrow { height: 10px; width: 10px; border-top: 3px solid  #204377; border-right: 3px solid  #204377; transform: translateY(20%) rotate(-45deg); }
.pagetop:hover, .pagetop:hover .pagetop__arrow { border-color: #0d91ce; }
