@charset "utf-8";
/* CSS Document */
        body,
        html {
            font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
            font-size: 14px;
			color: #491a00; 
            line-height: 1.5;
        }
        body {
            margin: 0;
        }
        h1,h2,h3,h4,h5,ul,ol,li,p,dl,dt,dd,figure {
            margin: 0;
            padding: 0;
            font-size: 1em;
        }
        a {
            color: var(--main-color);
        }
        h1 {
            font-size: 24px;
            font-weight: bold;
           /* border-bottom: 2px solid var(--main-border);*/
            padding: 20px 0;
        }
        section {
            padding: 10px;
        }
        img {
            width: 100%;
        }
        /*.h {
            border-bottom: solid 1px var(--main-color);
        }*/
        .h .h-inner {
            max-width: 990px;
            width: 100%;
            margin: 0 auto;
            padding: 10px 0;
        }
        .f{
            padding: 60px 0 35px;
        }
        .f .f-inner{
            max-width: 990px;
            width: 100%;
            margin: 0 auto;
            text-align: center;
        }
        .f .f-inner .f-copyright{
            font-size: 12px;
            margin-top: 10px;
        }
        .container {
            max-width: 990px;
            margin: auto;
        }
        .mt-s {
            margin-top: 15px;
        }
        .u-logo{
            background: url(https://otpn.jp/images/logo.png) no-repeat 50% 50%;
            display: block;
        }
        .u-bw {
            word-wrap: break-word;
        }
        .linkImg{
            position: relative;
        }
        .linkImg .floatLinks{
            position: absolute;
            bottom: 20%;
            left: 0;
            width: calc(100% - 4.2%);
            padding-left: 6.3%;
            display: flex;
            justify-content: flex-start;
            align-items: center;
			padding-bottom: 5%;
        }
        .linkImg .link_android{
            width: 14%;
			 margin-left: 1%;
        }
        .linkImg .link_apple{
            width: 12%;    
        }

        @media screen and (max-width: 767px) {
            .v-pc{
                display: none;
            }
            .v-sp{
                display: block;
            }
			 section {
                 padding: 0;
				 margin: 0 auto;
        }
            h1 {
                display: none;
            }
			h2{
				font-size: 24px;
                font-weight: bold;	
			}
			h3{
				font-size: 24px;
                font-weight: bold;
			}
			h4{
				font-size: 24px;
                font-weight: bold;
				padding-bottom: 40px;	
			}
            .h .h-inner{
                padding: 0 ;
            }
            .h .h-inner .h-logo a {
                width: 125px;
                height: 40px;
                background-size: 112px auto;
            }
            .f .f-inner .f-logo {
                width: 160px;
                margin: auto;
            }
            .linkApp{
                margin: 0;
				text-align: center;
				
            }
			 .linkApp .image{
				text-align: right;
				font-size: 8px;
				 font-weight: bold;
				 padding: 5px;
				
            }
            .linkApp .linkApp-head{
                background-image: url("../img/top-background.png");
                background-size: cover;
                background-repeat: no-repeat;
				width: 100vw;
            }
			.linkApp .tittle{
				display: flex;
				justify-content: center;
				padding-top: 20px;	
			}
			.linkApp .tittle img{
				width: 8vw;
				padding:1%; 	
			}
			
            .linkApp .linkApp-head .top-img{
                width: 100vw;
                margin-top: 20px;
				margin-bottom: 20px;
            }
			.linkApp .linkApp-head .header-img{
				 width: 85.3vw;
				 margin-top: 20px;
			}
            .linkApp .linkApp-body{
				display: flex;
				justify-content: center;
				margin-top:20px;
				padding-bottom:60px;
            }
			 .linkApp .linkbtn-body{
				 display: none;
				margin-top:20px;
				padding-bottom:60px;
            }
			.linkApp .linkbtn{
				width: 85vw;
				height: auto;
				margin: 0 auto;
			}
			
            .linkApp .linkApp-body >p{
				width:100%; 
                font-size: 18px;
                font-weight: bold;
            }
            .linkApp .linkApp-body .linkApp-body-links{
                margin-top: 40px;
                display: flex;
                justify-content: center;
                align-items: center;
            }
			.linkApp .linkApp-body .link_apple{
				width: 36.53vw;
				height: auto;
			}
			.linkApp .linkApp-body .link_android{
				width: 44.53vw;
				height: auto;
				margin-left: 15px;
			}
			
            .linkApp .linkApp-body .linkApp-body-links p{
                height: 45px;
            }
            .linkApp .linkApp-body .linkApp-body-links p.link_android{
                margin-right: 20px;
            }
        }
		 .linkApp .main{
                background-image: url("../img/main-background1.png");
                background-size: cover;
                background-repeat: no-repeat;
			 	width: 100vw;
                padding-top: 0px;
				margin: 0 auto;
            }
		.linkApp .main .main-txt1{
			font-size: 24px;
			 font-weight: bold;
			text-align: left;
			padding-top:40px;
			margin-left: 10%;
		}
		.linkApp .main .main-txt2{
			font-size: 24px;
			 font-weight: bold;
			text-align: right;
			margin-right: 10%;
			margin-bottom: 80px;
			padding-top: 20px;
		}
		.linkApp .main .main-txt3{
			font-size: 18px;
			 font-weight: bold;
			margin-top:85%;
		}
		.linkApp .main .main-txt4{
			font-size: 14px;
			 font-weight: bold;
			padding-bottom: 20px;
		}
		.linkApp .main .main-img1{
			width: 61vw;
			margin-left: 30%;
			margin-bottom: 40px;	
		}
		.linkApp .main .main-rogo{
			width: 20.5vw;
			padding-top:80px;
			text-align: center;
			margin: 0 auto;
		}
		.linkApp .main .main-img2{
			width: 100vw;
			height: 17vh;
			margin: 0 auto;
		}
		.attension {
			padding:1%;
			font-size: 14px;
			margin: 0 auto;
		}
		.linkApp .main .attension p{
			display: inline-block;
			text-align: left;
		}
        @media screen and (min-width: 768px) {
            .v-pc{
                display: block;
            }
            .v-sp{
                display: none;
            }
            .h .h-inner {
                padding: 10px 0;
            }
            .h .h-inner .h-logo a {
                width: 250px;
                height: 49px;
                background-size: 100% auto;
            }
            .f .f-inner .f-logo {
                width: 191px;
                margin: auto;
            }
        }