@charset "UTF-8";
/*
GENERAL STYLING
================================================ */
/*
PRODUCT PAGE TEXTBOOK
================================================ */


/*main-text-color : 메인 문단의 문자색 등
  main-title-color:  메인 제목의 문자색 등
  border-color: 텍스트 싸는 박스 선 색 등
  main-deco-color: 제목 주변 장식색 등 지정안함
  main-emph-color:글자 강조색
*/
  
:root {
--text-color:#444444;
--title-color:#012970;
--border-color:#f9f7e8;
--emph-color:#bb2235;
}


* {
     margin:0;
     padding:0;   
}


body {
    font-family: -apple-system, BlinkMacSystemFont,
                 "Hiragino Kaku Gothic ProN", "Hiragino Sans",
                 "Meiryo", "Yu Gothic", sans-serif;
    font-weight: 400; 
    border:none;
    margin:0;
    padding:0;
}

/*한국어폰트*/

.krfont {
    font-family: -apple-system, BlinkMacSystemFont,
                 "Apple SD Gothic Neo",
                 "Malgun Gothic",
                 "Noto Sans KR",
                 sans-serif;
}

/*옵션 전체틀 아래 마진*/
.option {
margin-top:0.3rem;
margin-bottom:1.5rem;
border-bottom: solid 0.3rem var(--border-color);  
}

.option_title {
    margin-bottom:0.6rem;
    padding:0rem 0.6rem;
    display:inline-block;
    line-height:1.5;
    font-size:1.2rem;
    font-weight:500;
    color:var(--title-color);
    border-left:0.5rem solid var(--title-color);
    }


/*각 설명 분류틀, 책소개, 작가소개 등
book_basicinfo, book_intro, book_author, book_inside, */


section {
  padding-bottom:1rem; 
  
}

/*책소개, 작가 소개 등의 타이틀*/
.list_title {
    display:block;
    line-height: 1.5;
    font-size: 1.2rem;
    color:var(--title-color);
    font-weight: 500;
    padding : 0.3rem ;
    background-color:var(--border-color);

}


/*서브타이틀 공통*/

.sub_title {
  display: block;
  line-height: 1.5;
  font-size: 1rem;
  margin: 0 0.3rem;
  color: var(--text-color);
  font-weight: 400;
}

/*서브타이틀*/

.first_sub_title {
    border-bottom: 0.1rem solid;
    padding: 0 0.3rem 0.3rem ;   
}

/*서브서브타이틀*/
.second_sub_title {
    padding: 0 0.6rem;
}


/*
문장설명은 항상 box_with_sub_p(위마진)와 함께. 즉 sub타이틀이나 p과 함께 세트로
box_~는 내용(서브타이틀과 설명)전체를 싸는 틀
제목, 문장 성격의 태그나 클래스에는 좌우 패딩이나 좌우 마진만. 박스 안에서 여백이 계승되게 하려면 magin으로 지정.  
단 p보다 더 들여써야 하는 하부 컨텐츠는  위쪽과 왼쪽에 마진 
*/

.box_with_sub_p {
    padding-top: 0.8rem;       
}

p {
    padding: 0 1rem;
    color:var(--text-color); 
   line-height: 1.5;
   font-size: 0.9rem;
 }


/*p보다 왼쪽 여백 더 넣는 컨텐츠*/ 

.sub_content {
    margin : 0.3rem 0 0 0.5rem;
} 


/*강조:글자크기*/
.emph_size{
font-size:1rem;
}

/*강조:글자색*/
.emph_color{
color:var(--emph-color);  
}