@charset "utf-8"; /* CSS Document */ /*------基本CSS(PC用記述記載)------*/ #precam_230104{ width: 100%; margin: 0 auto; overflow: hidden; max-width: 1000px; background-color: #000; } #precam_230104 .breadWrap.container, h1 { background-color: #fff; } #precam_230104 h1 { padding-bottom: 0.5rem!important; } #precam_230104 .breadcrumb{ padding-left: 0; } #precam_230104 .spBnr { display: none; } #precam_230104 img { width: 100%; height: auto; } #precam_230104 .main { position: relative; } #precam_230104 .main .img_area img { margin-bottom: 30px; } #precam_230104 .camnu { text-align: center; font-size: 14px; margin: 20px 5% 20px 76%; background: #f9c1da; color: #000; padding: 0.5% 0; } #precam_230104 .apply { border-radius: 20px; width: 90%; padding: 35px; box-sizing: border-box; margin: 0 auto 30px; background-color: #fff; color: #000; font-family: "Sawarabi Mincho", serif; } #precam_230104 .apply .questionBox { font-weight: bold; margin: 5px auto 20px; font-size: 18px; width: 84%; } #precam_230104 .apply .questionBox .must { color: #ff0000; } #precam_230104 .apply .pick { margin: 0 auto; width: 100%; } #precam_230104 .apply .box.answerBox { display: flex; flex-wrap: wrap; margin-left: 9%; padding: 0; font-size: 13px; } #precam_230104 .apply li.answer { padding: 1%; width: 50%; font-family: Verdana,'Lucida Grande','メイリオ',Meiryo,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','MS Pゴシック','MS PGothic',sans-serif; list-style: none; } #precam_230104 .apply .check_b li.answer { display: flex; } #precam_230104 .apply .check_b label { background-image: url(//im.belluna.jp/belluna/01/010101/e/pre_reg/precam_230104/img/230106/logo.png); background-repeat: no-repeat; display: block; height: 79px; white-space: nowrap; overflow: hidden; margin-bottom: 15px; line-height: 1; width: 220px; } #precam_230104 .apply .check_b .logo1 label{ background-position: 0 -4px; } #precam_230104 .apply .check_b .logo2 label{ background-position: 0 -330px; } #precam_230104 .apply .check_b .logo3 label{ background-position: 0 -458px; } #precam_230104 .apply .check_b .logo4 label{ background-position: 0 -677px; } #precam_230104 .apply .check_b .logo5 label{ background-position: 0 -563px; } #precam_230104 .apply .check_b .logo6 label{ background-position: 0 -791px; } #precam_230104 .apply .check_b .logo7 label{ background-position: 0 -904px; } #precam_230104 .apply .check_b .logo8 label{ background-position: 0 -1006px; } #precam_230104 .apply .check_b .logo9 label{ background-position: 0 -1095px; } #precam_230104 .button { margin: 5% auto 8%; width: 60%; text-align: center; position: relative; font-size: 16px; } #precam_230104 .button.disabled { border-radius: 29px !important; border-style: none!important; background-color: #ccc; font-weight: 700; line-height: 60px; cursor: not-allowed; } #precam_230104 .button a{ font-size: 18px; color: #fff!important; text-decoration: none; font-weight: bold; background: #a72126; transition: all .3s; padding: 3.5%; display: block; width: 100%; border-radius: 50px; } #precam_230104 .button a::after { content: ''; width: 12px; height: 12px; border: 0px; border-top: solid 1px #fff; border-right: solid 1px #fff; -ms-transform: rotate(45deg); -webkit-transform: rotate( 45deg ); transform: rotate( 45deg ); position: absolute; right: 10%; bottom: 24px; } #precam_230104 .regulation .title { text-align: center; padding: 10px 0; color: #170604; font-size: 24px; margin-bottom: 50px; border-bottom: 1px solid #333; } #precam_230104 .acd-content { width: 94%; margin: 0 auto; font-family: Verdana,'Lucida Grande','メイリオ',Meiryo,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','MS Pゴシック','MS PGothic',sans-serif; font-size: 13px; } #precam_230104 dt { font-weight: bold; border-bottom: 1px dotted #333; margin: 10px auto; } #precam_230104 .acd-content dd { margin-bottom: 20px; } #precam_230104 .acd-content .point { color: #f00; } #precam_230104 *, *:before, *:after { box-sizing: border-box; margin: 0px; } #precam_230104 .outer { display:block; margin: 20px auto 100px; max-width: 800px; padding: 20px 0; border-width: 1px 0; position:relative; background: #fff; color: #000; } #precam_230104 .inner{ position: relative; padding: 0px 40px; margin: 0 -20px; background: #fff; border-width: 0 1px; font-family: Verdana,'Lucida Grande','メイリオ',Meiryo,'ヒラギノ角ゴ ProN W3','Hiragino Kaku Gothic ProN','MS Pゴシック','MS PGothic',sans-serif; font-size: 13px; line-height: 1.4; } #precam_230104 .outer:before, #precam_230104 .outer:after, #precam_230104 .inner:before, #precam_230104 .inner:after { content:''; position: absolute; width: 80px; height: 80px; border: 20px solid #ffffff; border-radius: 50%; background: transparent; } #precam_230104 .outer:before{ top: -40px; left: -60px; clip: rect(40px, auto, auto, 40px); /* CSS 2.1 way - deprecated */ -webkit-clip-path: rectangle(50%, 50%, 100%, 100%, 0, 0); /* CSS 3 */ } #precam_230104 .outer:after{ top: -40px; right: -60px; clip: rect(40px, 40px, auto, auto); -webkit-clip-path: rectangle(0, 50%, 50%, 100%, 0, 0); } #precam_230104 .inner:before { bottom: -60px; left: -40px; clip: rect(auto, auto, 40px, 40px); -webkit-clip-path: rectangle(50%, 0, 100%, 50%, 0, 0); } #precam_230104 .inner:after { bottom: -60px; right: -40px; clip: rect(auto, 40px, 40px, auto); -webkit-clip-path: rectangle(0, 0, 50%, 50%, 0, 0); } /*------横幅が520px以下CSS(SP用記述記載)------*/ @media screen and (max-width: 520px) { #precam_230104 h1 { padding: 5px 10px!important; margin: 0!important; width: 100%; } #precam_230104 .breadWrap { margin-top: 0!important; padding-top: 3rem; } #precam_230104 .pcBnr { display: none; } #precam_230104 .spBnr { display: block; } #precam_230104 .inner dt { border-bottom: 1px dotted #333; margin-bottom: 3%; text-align: center; } #precam_230104 .camnu { margin: 15% 5% 3% 40%; } #precam_230104 .apply { padding: 14px; margin: 0 auto; margin-bottom: 10%; } #precam_230104 .apply .questionBox { margin: 1% auto 3%; font-size: 19px!important; width: 95%; } #precam_230104 .apply .box.answerBox { margin-bottom: 30px; margin-left: 0; padding: 0; } #precam_230104 .apply span.questionNo { display: block; text-align: center; } #precam_230104 .apply li.answer { width: 100%; font-size: 17px; margin-bottom: 2%; margin-bottom: 2%; } #precam_230104 .apply .check_b li.answer { display: flex; } #precam_230104 .apply .check_b label { width: 240px; } #precam_230104 .apply .check_b .logo1 label { background-position: 23px 0px; } #precam_230104 .apply .check_b .logo2 label { background-position: 23px -324px; } #precam_230104 .apply .check_b .logo3 label { background-position: 23px -453px; } #precam_230104 .apply .check_b .logo4 label { background-position: 23px -670px; } #precam_230104 .apply .check_b .logo5 label { background-position: 23px -554px; } #precam_230104 .apply .check_b .logo6 label { background-position: 23px -788px; } #precam_230104 .apply .check_b .logo7 label { background-position: 23px -900px; } #precam_230104 .apply .check_b .logo8 label { background-position: 23px -1000px; } #precam_230104 .apply .check_b .logo9 label { background-position: 23px -1089px; } #precam_230104 .button { background: #a72126; width: 90%; padding: 7%; border-radius: 90px; } #precam_230104 .button a{ text-decoration: none; font-size: 18px; } #precam_230104 .button a::after { width: 8px; height: 8px; top: 45%; right: 22px; } #precam_230104 .regulation .title { margin-bottom: 20px; } #precam_230104 dt { border-bottom: none; margin-bottom: 0px; } #precam_230104 .outer { margin: 2% auto 17%; max-width: 81%; padding: 6% 0; border-width: 1px 0; } }