/*
Theme Name: tareman-official
Description: tareman-official
Version: 20260126
*/

/*画像保存禁止などはプラグイン*/

:root {
  --color00--bk: #222;
  --color01--red: #b40926;
  --color02--white: #fff;


  --space-unit: 4px;
  --space-4: 4px;
  --space-8: 8px;
  --space-12: 12px;
  --space-16: 16px;
  --space-24: 24px;
  --space-32: 32px;
  --space-48: 48px;
  --space-64: 64px;
  --space-72: 72px;
  --space-96: 96px;
  --space-128: 128px;
  --space-176: 176px;
  --space-256: 256px;
  --container: 1200px; 
  --extend: 80px;


  --font-size-main: 17px;
  --font-size14: 0.823rem;
  --font-size20: 1.176rem;
  --font-size24: 1.411rem;
  --font-size32: 1.882rem;
  --font-size40: 2.352rem;

  --columns: 12;      
  --gutter-count: calc(var(--columns) - 1); /* 11本のガター */

  --col-1-width: calc((var(--container) - var(--space-24) * var(--gutter-count)) / var(--columns));
  --col-2-width: calc(var(--col-1-width) * 2 + var(--space-24) * 1);
  --col-3-width: calc(var(--col-1-width) * 3 + var(--space-24) * 2);
  --col-4-width: calc(var(--col-1-width) * 4 + var(--space-24) * 3);
  --col-5-width: calc(var(--col-1-width) * 5 + var(--space-24) * 4);
  --col-6-width: calc(var(--col-1-width) * 6 + var(--space-24) * 5);
  --col-7-width: calc(var(--col-1-width) * 7 + var(--space-24) * 6);
  --col-8-width: calc(var(--col-1-width) * 8 + var(--space-24) * 7);
  --col-9-width: calc(var(--col-1-width) * 9 + var(--space-24) * 8);
  --col-10-width: calc(var(--col-1-width) * 10 + var(--space-24) * 9);
  --col-11-width: calc(var(--col-1-width) * 11 + var(--space-24) * 10);
  --col-12-width: calc(var(--col-1-width) * 12 + var(--space-24) * 11); /* = 1200px */
}




html {height: 100%;font-size: var(--font-size-main);-webkit-text-size-adjust: none;line-height: 1.6; }
body { overflow-x: hidden;font-family: "Noto Sans JP", sans-serif;font-weight: normal;}

p{font-size: 1.0rem;line-height: 1.6em;margin: 0;}
h1 {font-size: 48px;line-height: 1.25;margin: 0;}
h2 {font-size: 36px;line-height: 1.3;margin: 0;}
h3 {font-size: 28px;line-height: 1.4;margin: 0;}
h4 {font-size: 20px;line-height: 1.5;margin: 0;}

p{color: var(--color00--bk);}
a {text-decoration: underline; color: inherit;border: none;transition: 0.1s;}
a:hover{opacity: 0.85;transition: 0.2s;color: var(--color03--grayD);}
ul,ol {list-style: none;padding: 0;margin: 0;}
*,*::before,*::after {  margin: 0;padding: 0;box-sizing: border-box;}
body,h1,h2,h3,h4,p,ul,ol,figure,blockquote,dl,dd {  margin: 0;}

table,tr,td,th{ margin: 0;padding: 0;line-height: 1.0;border-collapse: collapse;text-align: center;}


html, body {
  margin: 0;
}

section {
  width: 100vw;
  height: 100dvh;
}

.header_title{font-weight: bold;text-align: center;padding-top: var(--space-72);margin-bottom: var(--space-72);}

.links01{text-align: center;padding: 40px 0;}

.front_wrap01{padding: 0 var(--space-32);}
.haku_lang{max-width: 800px;margin: 0 auto;text-align: center;display: flex;flex-direction: column;gap: 30px;font-size: 1.2rem;}
.haku_lang01{display: block;border: 2px solid #333;padding: 5% 50px;border-radius: 20px;}
.haku_lang02{display: flex;justify-content: space-between;gap: 30px;}
.haku_lang03{display: block;border: 2px solid #333;border-radius: 20px;}


.list_notice{max-width: var(--col-6-width);margin: 0 auto;margin-top: var(--space-32);margin-bottom: var(--space-48);padding: 0 var(--space-32);}
.list_notice p{font-size: 1.1rem;}
.list_notice a{color: var(--color01--red);font-weight: bold;}
.list_pickup{margin-bottom: var(--space-24);}

.list_all{}
.list_all img{width: 100%;height: auto;vertical-align: top;}
.list_all a{color: var();}
.list_wrap{display: flex;flex-wrap: wrap;max-width: var(--col-12-width);margin: 0 auto;}
.list_Item{text-align: center;width: calc(25% - 30px);margin: 15px;}
.list_123 .list_wrap{justify-content: center;}
.list_123 {background: #eee;padding: var(--space-32);}
.list_123 p{text-align: center;}

.mangaWrap{overflow: hidden;}

.scroll_container { background: #222;overflow: auto;scroll-snap-type: y mandatory; height: 100vh;height: calc(var(--vh, 1vh) * 100);}
.scroll_area {scroll-snap-align: start;height: 100vh;position: relative;height: 100vh;height: calc(var(--vh, 1vh) * 100);}
.scroll_area img{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);height: 100%;}

.index01 {text-align: center;padding-top: 30px;}
.index01 p{font-weight: bold;margin-top: 10%;font-size: 1.2em;margin-bottom: 20px;color: #fff;}
.index01 li{margin-bottom: 15px;}
.index01 li a{color: #fff;}

.topImg {text-align: center !important;background: red;padding: 10px;margin-top: 80px;}
.topImg img{max-width: 800px !important;margin: 0 auto;}

.comingSoon{padding: 50px 10px;font-size: 0.9em;background: #333;color: #fff;}
.comingSoon br{display: inherit !important;}

/*.fv {
  min-height: 100vh; 
  min-height: calc(var(--vh, 1vh) * 100);

  #hakusinote h1{text-align: center;padding-top: 50px;}
#hakusinote #content{max-width: 1235px;}

.yoko_mangaWrap .scroll_area{}
.yoko_chui{text-align: center;font-weight: bold;color: red;font-size: 2.0rem;line-height: 1.2;}
.yoko_chuiBLOCK{max-width: 800px;margin: 0 auto;margin-top: 10%;}

#hakusinote section { overflow: hidden;text-align: center;margin-bottom: 0;}
#hakusinote br{display: none;}

}*/

.endGo{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;}

.endGo a{display: block;margin-bottom: 50px;color: #fff;}

/*media Queries スマートフォンとタブレットサイズ（959px以下）で適応したいCSS - スマホ・タブレット
---------------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 959px) {


	/*-- ここまで --*/
}
	
/*media Queries タブレットサイズ（600px～959px）のみで適応したいCSS -タブレットのみ
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) and (max-width: 959px) {


	/*-- ここまで --*/
}	
	
/*media Queries タブレット（600px）以上で適応したいCSS -タブレット・PC
---------------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 600px) {


	/*-- ここまで --*/
}

/*media Queries PCサイズ（960px）以上で適応したいCSS - PCのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (min-width: 960px) {


	/*-- ここまで --*/
}

/*media Queries スマホサイズ（599px）以下で適応したいCSS - スマホのみ
---------------------------------------------------------------------------------------------------*/
@media print, screen and (max-width: 599px) {


.list_Item{text-align: center;width: calc(50% - 30px);margin: 15px;}
.list_123 .list_wrap{justify-content: flex-start;}
.list_123 {padding: var(--space-32) 0;}

.topImg img{margin: 0 auto;height: auto !important;max-width: 100% !important;}



.scroll_area img{top: 41%;left: 50%;height: auto;width: 100%;}


.haku_lang02{display: block;justify-content: space-between;gap: 30px;}
.haku_lang03{display: block;border: 2px solid #333;border-radius: 20px;margin-bottom: 30px;}



/*.yoko_chui{text-align: center;font-weight: bold;color: red;font-size: 1.5rem;line-height: 1.3;}

*/


	/*-- ここまで --*/
}